一尘不染

如何在Angular 2中添加条件属性?

javascript

如何有条件地添加一个元素属性,例如checked复选框的?

NgAttr我认为以前的Angular版本具有并且NgChecked似乎都提供了我所追求的功能。但是,这些属性在Angular
2中似乎不存在,我看不到提供此功能的其他方法。


阅读 456

收藏
2020-05-01

共1个答案

一尘不染

null 删除它:

[attr.checked]="value ? '' : null"

要么

[attr.checked]="value ? 'checked' : null"

暗示:

属性与属性

当您在其中添加此绑定的HTML元素不具有该绑定中使用的名称的属性(checked在这种情况下),并且也没有将Angular组件或指令应用于具有的同一元素时@Input()checked;,则[xxx]="..."无法使用。

没有此类属性时要绑定的内容

替代方案是[style.xxx]="..."[attr.xxx]="..."[class.xxx]="..."这取决于你试图完成什么。

因为<input>仅具有checked属性,但没有checked属性[attr.checked]="..."是此特定情况的正确方法。

属性只能处理字符串值

常见的陷阱还在于,对于[attr.xxx]="..."绑定,值(...)始终是字符串化的。仅属性和@Input()s可以接收其他值类型,例如布尔值,数字,对象,…

__元素的 大多数 属性和属性都是连接的,并且具有相同的名称。

属性-属性连接

当绑定到属性时,该属性还仅从该属性接收字符串化的值。
当绑定到该属性时,该属性将接收与其绑定的值(布尔值,数字,对象等),而该属性又是字符串化的值。

此后Angular进行了更改,知道了这些特殊情况并进行了处理,<label[for]="即使没有这样的属性,您也可以绑定到(与相同colspan

2020-05-01