了解angular2--template(译)

摘要: 因为ionic2的使用,需要了解一下ng2的新特性

Angular新旧版本的template很相似,让我们根据一个简答的模板来了解一下ng2

<div>
Hello my name is {{name}} and I like {{thing}} quite a lot.
</div>

{{}}:rending ---用两个大括号来传递变量值

[]:属性绑定---用中括号来绑定变量和组件

<video-control [player]="myPlayer"></video-control>

如果<video-control>组件中已经声明了player属性,那么通过这个组件中的类生成的实例都可以被使用

():监听事件

<my-component (click)="onClick($event)"></my-component>

如果要让事件冒泡到他的父元素上,只需要用在事件前加上`即可

<my-component (^click)="onClick($event)">
<button>I bubble up</button>
</my-component>

*:星号根据后面的标记嵌入一个新的模板页面到这个组件中,就像这样

<my-component *ng-for="object in array">
</my-component>>

这将会在组件中插入一个新的页面,而不必向这个组件传递数据

原文链接angular2的模板