关于Ember的一些小技巧总结
2017-02-21 20:23
190 查看
接触ember并使用它做项目快一年时间了,中间遇到问题、解决问题,现想对其在使用过程中的一些小技巧做个总结。
partial 也是渲染所需模板
那么两者差别在哪?
outlet是一个资源的子路由的入口,也就是说它对应的资源拥有独立的路由和控制器。
而partial所渲染的资源是没有的,它的渲染不改变上下文环境。
The {{outlet}} helper lets you specify where a child route will render in your template.
The partial helper renders another template without changing the template context.
filter用法为函数,filterBy用于字段
当然你也可以直接computed整个对象,但是它们所消耗的时间差别极大。它可以缩小计算属性依赖参数范围。
时间格式化要用js很烦有木有!?
数字取小数点后几位,每次用js对数据处理很麻烦有木有!?
需要渲染的数据是几个数据的简单数学计算,需要用js来写,很简单的需求却需要重复的代码有木有!?
……
有了这个registerBoundHelper功能后一切都变了有木有!?
controllerFor
当你在A Route中需要用到B Route中的数据什么的,这个时候controllerFor就派上用场了。needs
有的时候,控制器需要依赖其他控制器,这是通过“注入”来实现的。具体使用方法如下:needs: ['monitorErrorList'],
使用each as代替each in
循环渲染使用上述方式的好处就是:可扩展。见如下例子://JS var developers = [{name: 'Yehuda'},{name: 'Tom'}, {name: 'Paul'}]; //HBS {{#each developers key="name" as |person|}} {{person.name}} {{! `this` is whatever it was outside the #each }} {{/each}}
//同样适用于数据 //JS var developerNames = ['Yehuda', 'Tom', 'Paul']; //HBS {{#each developerNames key="@index" as |name|}} {{name}} {{/each}}
//另外,可以使用index属性 //HBS <ul> {{#each people as |person index|}} <li>Hello, {{person.name}}! You're number {{index}} in line</li> {{/each}} </ul>
outlet与partial
outlet 可以动态加载模版partial 也是渲染所需模板
那么两者差别在哪?
outlet是一个资源的子路由的入口,也就是说它对应的资源拥有独立的路由和控制器。
而partial所渲染的资源是没有的,它的渲染不改变上下文环境。
The {{outlet}} helper lets you specify where a child route will render in your template.
The partial helper renders another template without changing the template context.
Ember.computed的一些方法
Ember.computed.alias
needs是注入需要的控制器,使用的时候我们最好使用Ember.computed.alias,会增加代码可读性。Ember.computed.and、Ember.computed.bool、Ember.computed.or、Ember.computed.not
这几个非常好理解,也非常好用。Ember.computed.filter 、Ember.computed.filterBy
都是用于过滤。filter用法为函数,filterBy用于字段
function(item, index, array);
@each. 用法
用于computed对象中某个字段。当然你也可以直接computed整个对象,但是它们所消耗的时间差别极大。它可以缩小计算属性依赖参数范围。
//比如某个表是否按照某个字段升序or降序排列 sort: Ember.computed('listColumns.@each.sortOrder', { ... })
Handlebars.compile
这个会经常用到。编译模板。transitionTo
控制器中的路由跳转Ember.Handlebars.registerBoundHelper
我想说这个太好用了!时间格式化要用js很烦有木有!?
数字取小数点后几位,每次用js对数据处理很麻烦有木有!?
需要渲染的数据是几个数据的简单数学计算,需要用js来写,很简单的需求却需要重复的代码有木有!?
……
有了这个registerBoundHelper功能后一切都变了有木有!?
//来个取小数点后两位的例子 Ember.Handlebars.registerBoundHelper('helper-tofixed', function(value, length) { length = typeof length == 'number' ? length : 2; return parseFloat(Number(value).toFixed(2)); }); //HBS //floatNumber 为某个需要截取的有很多小数点的数字啦~ {{helper-tofixed floatNumber}}
sendAction
组件中,对于具体action实现抛出去。相关文章推荐
- 个人总结 关于 自动适应 一些小技巧
- 这是我们公司总结的一些关于中文乱码问题的一些解决方案和经验和大家分享!
- 这是我们公司总结的一些关于中文乱码问题的一些解决方案和经验和大家分享!
- 关于JDK和JRE的一些总结
- 总结的关于数据库的一些面试题
- [导入]关于ASPNET在IIS一些问题的经验总结
- 这几天总结的一些C++编程经验--关于静态库
- 关于2-SAT的一些总结
- 关于这两天MDT部署WIN7加域以及权限赋予的一些总结
- ios SDK开发之关于CoreAnimation的一些注意点总结
- 关于Java中equal函数和==的一些区别做一个总结,以供自己随时查看复习。
- 关于spark利用jar包跑job的一些总结(一)
- 关于C++容器的一些总结
- 关于职业的一些反思与总结
- 关于.net中反射的一些个人总结
- 关于C语言中return的一些总结
- 关于RakNet的一些入门的入门的总结
- 关于STM32与SD卡通信的一些思考与总结
- 关于二进制的一些总结
- 自己收集的google Analytics的关于flex 的一些总结