随笔分类 - Ember.js
摘要:1.有时候,你可能希望定义一个模板,它包裹其他模板提供的内容。 例如,假设我们创建一个blog-post模板,我们可以使用它来展现一个blog post: app/components/blog-post.hbs <h1>{{title}}</h1> <div class="body">{{body
阅读全文
摘要:1. 默认情况下,一个组件在它使用的模板范围中没有访问属性。 例如,假想你有一个blog-post组件被用来展示一个blog post: app/templates/components/blog-post.hbs <h1>Component: {{title}}</h1> <p>Lorem ips
阅读全文
摘要:一、概述 1. 为了定义一个组件,创建一个模板,它的名字以components/开头。为了定义一个新组件{{blog-post}},例如,创建一个components/blog-post模板。 2.注意:在组件的名字中至少要有一个破折号。所以blog-post是可以接受的名字,audio-playe
阅读全文
摘要:1. HTML被设计的时候,浏览器是一个简单的文件浏览器。开发构建大的Web应用程序需要更多的东西。 2. 不是试图取代HTML,然而,Ember.js拥抱它,然后增加了许多新功能使得构建web应用程序现代化。 3. 目前,您仅限于创建由W3C所提供的标签,W3C正工作在自定义元素规范,这是一个好主
阅读全文
摘要:一、概述 在一个路由的跳转过程中,Ember路由器传递一个跳转对象到被跳转调用的路由的不同的hooks中。任何一个hook获取这个跳转对象,有能力通过调用transition.abort()终止跳转,并且如果跳转对象被储存,它可以通过调用transition.retry()稍后被尝试。 二、Prev
阅读全文
摘要:除了在上节中描述的技术,Ember路由器通过使用error和loading substates为自定义异步跳转提供强大而可重写的约定。 一、loading Substates 1. 在跳转过程中,Ember路由器允许你从各种各样的beforeModel/model/afterModel hooks中
阅读全文
摘要:本节介绍了路由器的一些更高级的功能和处理复杂异步逻辑的能力。 一、A word on promises 1. 在Ember的Router中Ember使用了大量的Promises概念来处理异步逻辑。简而言之,promises就是一个代表最终值的对象。一个promise可以fulfill(成功解析值)或
阅读全文
摘要:一、概述 1. 在URL中查询参数是可选的key-value对,出现在?的右边。例如,下面的URL有两个查询参数,sort和page,对应的值分别是ASC和2。 example:http://example.com/articles?sort=ASC&page=2 2. Query params允许
阅读全文
摘要:1. 默认的路由器使用浏览器的hash来加载应用程序的开始状态并且当你移动时同步保持。目前,这依赖于浏览器中存在的hashchange事件。 2. 假设下面的路由器,输入/#/posts/new将会把你带到posts.new路由。 app/router.js Router.map(function(
阅读全文
摘要:一、Transitioning and Redirection 从一个route调用transitionTo或者从一个controller调用transitionToRoute将会停止任何进程中的任何跳转并且开启一个新的,作为重定向功能。 transitionTo携带的参数和行为和link-to辅助
阅读全文
摘要:1. route handler一个重要的任务就是渲染合适的模板到屏幕。 2. 默认的,一个route handler将会呈现模板到最近的父模板。 app/router.js Router.map(function() { this.route('post'); }); app/routes/pos
阅读全文
摘要:1. 改变URL可能也会改变屏幕显示哪个模板。然而,如果它们有信息去显示,模板才是有用的。 2. 在Ember.js中,一个模板从一个controller检索信息去显示。 3. 为了告诉controller去展示哪个模板,在路由处理器的setupController hook中设置它的model属性
阅读全文
摘要:一、概述 应用程序中,templates被models支持。但是templates是如何知道它们应该显示哪个model呢? 例如,你有一个photos模板,它是如何知道它该呈现哪个model呢? 这就是Ember.Route工作的一部分。你可以通过定义一个和template同名的route来告诉模板
阅读全文
摘要:就像在routing guide中介绍的那样,不管什么时候你在路由器中定义一个新路径,Ember.js就会尝试寻找一个对应的route,controller,template,它们的命名都是根据命名约定的。如果没找到任何这些对象的实现,会为你生成合适的对象。 一、Generated Routes 假
阅读全文
摘要:一、概述 1. 当应用程序启动时,路由器负责显示模板,加载数据,另外还设置应用程序的状态。这是通过匹配当前URL到你定义的routes来实现的。 2. Ember app router中的Map方法可以被调用来定义URL映射。当调用Map时,你应该传递一个function,它将会被调用,this会被
阅读全文
摘要:一、Routing 1. 当用户与应用程序交互时,它会经过很多状态。Ember.js为你提供了有用的工具去管理它的状态和扩展你的app。 2. 要理解为什么这是重要的,假设我们正在编写一个Web应用程序来管理一个博客。如:是当前登录的用户吗?他们是管理员用户吗?他们在看什么?是设置屏幕打开?他们正在
阅读全文
摘要:一、概述 1. Helpers允许你向你的模板添加超出在Ember中开箱即用的额外的功能。辅助器是最有用的,用于将来自模型和组件的原始值转换成更适合于用户的格式。 2. 例如,假设我们有一个Invoice model,它包含一个totalDue属性,它代表那个invoice的总数。由于我们不希望我们
阅读全文
摘要:Ember提供几个辅助器允许你使用不同的方法渲染模板(render templates)。 一、The {{partial}} Helper {{partial}}以呈现的模板作为参数,并在这里呈现模板。 {{partial}}不改变上下文或作用域。它简单的将给定的模板放置到当前作用域中。 app/
阅读全文
摘要:一、Development Helpers Handlebar和Ember有好多个辅助器可以使模板开发更容易。 这些辅助器输出变量到浏览器的控制台,或者从模板中激活debugger。 二、Logging {{log}}辅助器可以很容易的将当前上下文中的变量或者表达式输出到你的控制台console中:
阅读全文
摘要:一、Input Helpers Ember中{{input}}和{{textarea}}是创建常规表单控件最简单的方法。 {{input}}包裹内建的Ember.TextField和Ember.Checkbox视图,然而{{textarea}}包裹Ember.TextArea。使用这些辅助器,你可以
阅读全文

浙公网安备 33010602011771号