NgFor- 循环逻辑如果希望利用一组可遍历的数据动态构造模板,那么应当使用NgFor指令。 例如示例中的EzStar组件,用来展示演员的作品列表:迭代NgFor指令应用在template元素上,对ngForOf属性指定的数据集中的每一项 实例化一个template的内容:1 2 -----...
分类:
其他好文 时间:
2015-12-15 10:19:48
阅读次数:
142
使用分支逻辑如果组件的模板需要根据某个表达式的不同取值展示不同的片段,可以使用NgSwitch系列指令来动态切分模板。比如右边示例中的广告组件EzPromotion,需要根据来访者性别的不同推送不同的广告:NgSwitch包含一组指令,用来构造包含多分支的模板:NgSwitchNgSwitch指令可...
分类:
其他好文 时间:
2015-12-14 21:26:19
阅读次数:
236
#var - 局部变量有时模板中的不同元素间可能需要互相调用,Angular2提供一种简单的语法将元素 映射为局部变量:添加一个以#或var-开始的属性,后续的部分表示变量名, 这个变量对应元素的实例。在下面的代码示例中,我们为元素h1定义了一个局部变量v_h1,这个变量指向 该元素对应的DOM对象...
分类:
其他好文 时间:
2015-12-11 18:51:52
阅读次数:
239
(event) - 监听事件在模板中为元素添加事件监听很简单,使用一对小括号包裹事件名称,并绑定 到表达式即可:上面的代码实例为DOM对象h1的click事件添加监听函数onClick()。另一种等效的书写方法是在事件名称前加on-前缀:1 @View({template : `HELLO`})例如...
分类:
其他好文 时间:
2015-12-11 14:48:50
阅读次数:
158
directives - 使用组件在Angular2中,一个组件的模板内除了可以使用标准的HTML元素,也可以使用自定义的组件!这是相当重要的特性,意味着Angular2将无偏差地对待标准的HTML元素和你自己定义的组件。这样, 你可以建立自己的领域建模语言了,这使得渲染模板和视图模型的对齐更加容易...
分类:
其他好文 时间:
2015-12-10 21:47:07
阅读次数:
145
0、导言Angular1作为最流行的前端MV*框架,给前端开发带来了极大的便利性。但是,仍然有许多不好的地方已经很难再改变了。Angular团队根据WEB发展的趋势和Angular1中积累的经验来开发了一个全新的Angular,也就是Angular2。1、优势Angular2做了很激进的变化,带来的...
分类:
其他好文 时间:
2015-12-10 17:08:19
阅读次数:
129
初识Angular2写一个Angular2的Hello World应用相当简单,分三步走:1. 引入Angular2预定义类型1 import {Component,View,bootstrap} from "angular2/angular2";import是ES6的关键字,用来从模块中引入类型定...
分类:
其他好文 时间:
2015-12-10 16:39:34
阅读次数:
309
Besides @Input(), we can also use properties on the @Component, to pass the data.import {Component, View, NgFor, Input} from 'angular2/angular2';@Comp...
分类:
其他好文 时间:
2015-11-02 06:41:39
阅读次数:
176
import {Input, Component, View, NgClass} from "angular2/angular2";@Component({ selector: 'todo-item-render'})@View({ directives: [NgClass], s...
分类:
其他好文 时间:
2015-10-28 07:00:49
阅读次数:
197
When creating a service, need to inject the sercive into the bootstrap():import {bootstrap, Component, View} from "angular2/angular2";import {TodoInpu...
分类:
其他好文 时间:
2015-10-23 16:12:35
阅读次数:
192