angular 2+-在多焦点输入元素上设置类或样式

Question

当输入聚焦时，我在更多的输入元素上设置了一个类或样式。

例如，如果只有一个输入元素：

<span [ngClass]=["control"? "classA":"classB"]>
<input type="text" (foucs)="control=true" [ngClass]=["control"? "classC":"classD"]>
</span>

当输入元素越多，需要更多的control参数：

<span [ngClass]=["control_1"? "classA":"classB"]>
<input type="text" (foucs)="control=true" [ngClass]=["control_1"? "classC":"classD"]>
</span>
<span [ngClass]=["control_2"? "classA":"classB"]>
<input type="text" (foucs)="control=true" [ngClass]=["control_2"? "classC":"classD"]>
</span>
.
.
.

有任何方法可以做到这一点，一个用于更多输入元素的参数，比如当(focus)返回this元素时。

Answer 1

因此，要实现您所要求的目标，您需要执行以下操作：

<span [ngClass]="{ 'classA': control, 'classB': !control }">
<input type="text" (focus)="control=true" (blur)="control=false" [ngClass]="{ 'classC': control, 'classD': !control }">
</span>

密切关注如何插入类属性(有引号与无引号(

此外，你在拼写和指令的一般使用方面也有很多错误。您很可能需要访问文档