Emberjs教程-Emberjs使用大全
【Emberjs教程-Emberjs使用大全】
Emberjs——一个用于创建 web 应用的 JavaScript MVC 框架,采用基于字符串的Handlebars模板,支持双向绑定、观察者模式、计算属性(依赖其他属性动态变化)、自动更新模板、路由控制、状态机等。
Ember使用自身扩展的类来创建Ember对象、数组、字符串、函数,提供大量方法与属性用于操作。
每一个Ember应用都使用各自的命名空间,避免冲突。
Ember采用可嵌套的视图层,使视图变得有层次。
构建应用
开始一个应用,需要先使用Ember.Application.create()来创建一个实例。
然后分别定义模型(Model)、视图(View)、控制(Controller)层。
使用extend()方法创建子类,如用Ember.Object.extend()创建一种模型类,用Ember.View.extend()创建视图类,用Ember.Controller.extend()创建控制类。通过create()方法生成实例。
你还需要在HTML页面里使用Handlebars加入模板,以完成视图的显示。
当你与页面进行交互时,视图接收到你的操作,通过控制器将事件传递给模型,模型对数据进行修改,视图监控到模型数据的修改,相应的更新页面。
完成最简单的一个应用,总会包含下面的代码:
/*创建命名空间*/
App = Ember.Application.create();
/*创建应用视图类并指定模板名称,该类会创建一个实例并插入应用的视图层级中作为根视图*/
App.ApplicationView = Ember.View.extend({
templateName: 'application'
});
/*创建应用控制器类,为视图提供上下文,模板里的内容将由该控制器提供*/
App.ApplicationController = Ember.Controller.extend();
/*创建路由控制,用于在应用的各种状态中前进或后退,也可以通过序列化的URL直接进入到某个状态*/
App.Router = Ember.Router.extend({
root: Ember.Route.extend({
index: Ember.Route.extend({
route: '/'
})
})
});
/*初始化应用,启动路由进程,创建视图实例并插入到页面*/
App.initialize();
/*在HTML页面加入模板*/
在Ember中默认使用 “application” 作为模板名称,以及作为视图与控制器的前缀。如果用于创建类时,首字母必须大写。
如果未定义ApplicationView或ApplicationController,Ember将会抛出异常提示。
本文来源 我爱IT技术网 http://www.52ij.com/jishu/4367.html 转载请保留链接。
- 评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
-
