在Angular2中綁定屬性與[attr.attributeName]和[attributeName]的區別

Question

我是Angular2的新手。當我用以下方式來完成iam綁定屬性時。

例1：

<input type="number" [max]="variableName"> 

例2：

<select [(ngModel)]="selectedItem"> 
    <option *ngFor="let item of itemList" [value]="item.value" [selected]="selectedItem==item.value">{{item.name}}</option> 
</select> 

有些時候，這些綁定使用失敗。

然後我用下面的語法通過後綴attr綁定屬性。爲了它。

例1：

<input type="number" [attr.max]="variableName"> 

例2：

<select [(ngModel)]="selectedItem"> 
     <option *ngFor="let item of itemList" [value]="item.value" [attr.selected]="selectedItem==item.value">{{item.name}}</option> 
    </select> 

這些語法使用像魅力的工作一些時間。

請幫助我瞭解這兩個綁定[attributename]和[attr.attributeName]之間的區別，並重點介紹了使用這些特定的語法。

Answer 1

這是屬性綁定

[selected]="selectedItem==item.value" 

這是屬性綁定

[attr.selected]="selectedItem==item.value" 

參見What is the difference between attribute and property?財產和屬性之間的差異。

只有當元素實際上具有該名稱的屬性時，屬性綁定才起作​​用。某些屬性會自動反映到屬性中。

屬性只是將具有該名稱的屬性添加到DOM元素。已知屬性由元素（和角度組件的@Input()）讀取。 自定義屬性只是添加到DOM，不處理元素。