Angular 如果验证通过，如何添加类

我是一个新手，正在努力学习。我被困在这里了。当该字段中出现错误时，我可以添加一个类，但是如果假设没有错误，我就不需要添加另一个类。这就是我写的

<input type="text" 
[class.is-invalid]="name.invalid && (name.dirty || name.touched) && name.errors.minlength" minlength="5" 
required 
name="name" 
#name="ngModel" 
[(ngModel)]="account.name" 
placeholder="Enter your Account name" 
class="form-control">

---

在上面的代码中，我可以添加

是无效的

类，但在else条件下，我还想添加

是有效的

类。有什么建议吗？

您可以在一个组件上有多个

[class.]

指令，例如：

<div
[class.is-invalid]="..."
[class.is-valid]="..."
>
...
</div>

...

另一种方法是使用[ngClass]指令：

<div
[ngClass]="condition ? 'is-invalid' : 'is-valid'"
>
...
</div>

...

一个组件上可以有多个

[class.]

指令，例如：

<div
[class.is-invalid]="..."
[class.is-valid]="..."
>
...
</div>

...

另一种方法是使用[ngClass]指令：

<div
[ngClass]="condition ? 'is-invalid' : 'is-valid'"
>
...
</div>

...

我曾经这样使用过

[ngClass]=“name.invalid&&（name.dirty | | | name.toucted）&&name.errors.minlength？'is invalid'：'is valid'”

但问题是默认情况下添加了有效类。有什么解决方案吗？如果

name.invalid

为false-在用户更改字段之前为false-

为有效

。所以你的情况有三种结果：未触及，有效，无效。请注意，还可以将方法绑定到

[ngClass]

：

[ngClass]=getClass（）

。在组件中的

getClass

中，您可以实现一个更复杂的方法，该方法返回所有3种情况的值。Cheers我曾经这样使用过

[ngClass]=“name.invalid&&（name.dirty | | | | name.touch）&&name.errors.minlength？'is invalid'：'is valid'”

但问题是默认情况下添加了有效类。有什么解决方案吗？如果

name.invalid

为false-在用户更改字段之前为false-

为有效

。所以你的情况有三种结果：未触及，有效，无效。请注意，还可以将方法绑定到

[ngClass]

：

[ngClass]=getClass（）

。在组件中的

getClass

中，您可以实现一个更复杂的方法，该方法返回所有3种情况的值。干杯