在 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"

另请参阅属性和属性之间的

区别是什么？，了解属性和属性之间的区别。

仅当元素实际具有具有该名称的属性时，属性绑定才有效。某些属性会自动反映到属性中。

属性只是将具有该名称的属性添加到 DOM 元素。已知属性由元素读取(以及 Angular 组件的@Input()(。自定义属性只是添加到 DOM 中，而不是由元素处理。