Angular 2用ngClass做else [英] Angular 2 Doing an else with ngClass

问题描述

我有以下模板:

<p [ngClass]="{checked: condition, unchecked: !condition}">

这是可行的，但我发现它有点难看，因为我不得不重复两次该条件.有没有办法像这样:[ngClass]={condition ? checked : unchecked}(不起作用)

While this is working, I find it a bit ugly as I have to repeat twice the condition. Is there a way to something like : [ngClass]={condition ? checked : unchecked} (which is not working)

谢谢

推荐答案

确实

<p class="{{condition ? 'checked' : 'unchecked'}}">

或

<p [ngClass]="condition ? 'checked' : 'unchecked'">

或

<p [ngClass]="[condition ? 'checked' : 'unchecked']">

---

Angular 9更新

但是您应该知道，不同类型的类绑定的行为方式有所不同，尤其是当同一元素上存在多种类型的类绑定时.

---

Angular 9 Update

But you should know that there's a difference in how different types of class bindings behave, especially when there are multiple types of class bindings on the same element.

新的编译器Ivy为它带来了更多的清晰度和可预测性. 在此处详细了解

And the new compiler, Ivy, brings more clarity and predictability to it. Read More about it here

这篇关于Angular 2用ngClass做else的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！