所有细节可以在这里找到:https://angular.io/docs/ts/latest/guide/template-syntax.html

directiveName - is the short hand form for structural directives where the long form can only be applied to <template> tags. The short form implicitely wraps the element where it's applied in a <template>. [prop]="value" is for object binding to properties (@Input() of an Angular component or directive or a property of a DOM element). There are special forms: [class.className] binds to a css class to enable/disable it [style.stylePropertyName] binds to a style property [style.stylePropertyName.px] binds to a style property with a preset unit [attr.attrName] binds a value to an attribute (visible in the DOM, while properties are not visible) [role.roleName] binds to the ARIA role attribute (not yet available) prop="{{value}}" binds a value to a property. The value is stringified (aka interpolation) (event)="expr" binds an event handler to an @Output() or DOM event #var or #var has different functions depending on the context In an *ngFor="#x in y;#i=index" scope variables for the iteration are created (In beta.17 this is changed to *ngFor="let x in y; let i=index"`) On a DOM element <div #mydiv> a reference to the element On an Angular component a reference to the component On an element that is an Angular component or has an Angular directive where exportAs:"ngForm" is defined, #myVar="ngForm" creates a reference to this component or directive.

如前所述，Angular的文档，尤其是“英雄教程”，对此有更深入的解释。如果你想看的话，这里是链接。

括号是您正在处理的元素的事件，例如单击示例中的按钮;这也可以是mousedown, keyup, onselect或该元素的任何动作/事件，在=后面是要调用的方法的名称——使用圆括号进行调用。该方法应该在你的组件类中定义，即:

<element (event)="method()"></element>

括号则相反。它们从你的类中获取数据——与发送事件的括号相反——所以一个常见的例子是使用这样的风格:

<element [ngStyle]="{display:someClassVariable}">

看到了吗?您正在根据您的模型/类为元素赋予一个样式。

你本可以用…

<element style="display:{{ModelVariable}};">

建议你使用双花括号的东西，你将打印在屏幕上，如:

<h1>{{Title}}</h1>

无论你使用什么，如果你是一致的，它将有助于你的代码的可读性。

最后，对于你的*问题，这是一个较长的解释，但它非常非常重要:它抽象了一些方法的实现，否则你将不得不让一个ngFor工作。

一个重要的更新是在ngFor中你将不再使用哈希;你需要使用let代替，如下所示:

<tr *ngFor="let movie of movies">
    <td>{{movie.title}}</td>
</tr>

最后值得一提的是，上面所有的方法也适用于你的组件，例如，如果你在组件中创建了一个方法，它将被using()调用:

<my-owncomponent 
    (onSearched)="MethodToCall()" 
    [MyInputData]="SearchParamsArray"></my-owncomponent>

[]—属性绑定 从数据源到视图目标的单向方式。 如

{{expression}}
[target]="expression"
bind-target="expression"

我们可以用bind-代替[]

() ->事件绑定 从视图目标到数据源的单向连接

(target)="statement"
on-target="statement"

我们可以用on-代替()

[()]-一个盒子里的双向绑定香蕉

[(target)]="expression"
bindon-target="expression"

我们可以用bindon-代替[()]

所有细节可以在这里找到:https://angular.io/docs/ts/latest/guide/template-syntax.html

directiveName - is the short hand form for structural directives where the long form can only be applied to <template> tags. The short form implicitely wraps the element where it's applied in a <template>. [prop]="value" is for object binding to properties (@Input() of an Angular component or directive or a property of a DOM element). There are special forms: [class.className] binds to a css class to enable/disable it [style.stylePropertyName] binds to a style property [style.stylePropertyName.px] binds to a style property with a preset unit [attr.attrName] binds a value to an attribute (visible in the DOM, while properties are not visible) [role.roleName] binds to the ARIA role attribute (not yet available) prop="{{value}}" binds a value to a property. The value is stringified (aka interpolation) (event)="expr" binds an event handler to an @Output() or DOM event #var or #var has different functions depending on the context In an *ngFor="#x in y;#i=index" scope variables for the iteration are created (In beta.17 this is changed to *ngFor="let x in y; let i=index"`) On a DOM element <div #mydiv> a reference to the element On an Angular component a reference to the component On an element that is an Angular component or has an Angular directive where exportAs:"ngForm" is defined, #myVar="ngForm" creates a reference to this component or directive.