属性指令和元素属性语法之间的区别？

Question

如果我们使用[]标记设置属性或属性指令，Angular 2如何区分？它们看起来都一样。

例如：

<div [count]="counter"></div>
<div [ngClass]="setClasses()"></div>

是否首先检查指令，如果不存在则将其解释为属性赋值？我很困惑。

我的意思是如果我们有一个名为“value”的属性和一个名为“value”的指令。 Angular2如何处理这个问题？

Answer 1

首先，理解属性和属性之间的区别非常重要。

请参阅
- Properties and Attributes in HTML

如果angular在指令或组件上找不到@Input()，而且它也不是它抛出的本机属性 - Can't bind to 'for' since it isn't a known native property angular2

Angular对属性和属性绑定具有不同的绑定语法

[count]=...和[ngClass]=...是属性绑定 属性绑定也是 - count="someString" - attr.count="{{someProperty}}"或 - [attr.count]="someProperty"。

Answer 2

  

目标名称始终是属性的名称，即使它看起来像是其他名称。元素属性可能是更常见的目标，但Angular 首先查看名称是否是已知指令的属性。   从技术上讲，Angular将名称与指令输入，指令的输入数组中列出的属性名称之一或使用@Input（）修饰的属性进行匹配。这些输入映射到指令自己的属性。

高于Template Syntax doc部分绑定目标。

另请参阅Why does simply [myHighlight]="..." work for an attribute directive?，我在这里问为什么我们不必写<div ngClass [ngClass]="...">。