在Angular2中将属性与[attr.attributeName]和[attributeName]绑定之间的区别 [英] Difference between binding the attributes with [attr.attributeName] and [attributeName] in Angular2
问题描述
我是Angular2的新手.当IAM绑定属性时,我通常采用以下方式.
I am new to Angular2. When iam binding attributes i used to do it in following way.
示例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>
有时这些绑定曾经失败.
Some times these bindings used to fail .
然后,我使用以下语法通过在属性后缀attr来绑定属性.为此.
Then i used the following syntax to bind attribute by suffixing attr. for it.
示例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>
这些语法有时会像魅力一样工作.
These syntax used to work like charm some times.
请帮助我学习这两个绑定[attributename]
和[attr.attributeName]
之间的区别,并且在使用这些特定语法时非常重要.
Please help me in learning the difference between these two bindings [attributename]
and [attr.attributeName]
with there importance in using those particular syntax.
推荐答案
这是属性绑定
[selected]="selectedItem==item.value"
这是属性绑定
[attr.selected]="selectedItem==item.value"
另请参见属性与属性有什么区别?区分属性和属性.
See also What is the difference between attribute and property? for the difference between property and attribute.
仅当元素实际上具有具有该名称的属性时,属性绑定才起作用.一些属性会自动反映到属性中.
Property binding works only if the element actually has a property with that name. Some property are automatically reflected to attributes.
Attribute只是将具有该名称的属性添加到DOM元素.已知属性由元素(和Angular组件的@Input()
)读取.
自定义属性只会添加到DOM中,而不会由元素进行处理.
Attribute just adds an attribute with that name to the DOM element. Known attributes are read by elements (and @Input()
s of Angular components).
Custom attributes are just added to the DOM and not processed by the element.
这篇关于在Angular2中将属性与[attr.attributeName]和[attributeName]绑定之间的区别的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!