纳克级相反条件的都不能正常工作

<div ng-class="{ 'green' : flag, 'red' : !flag }"> 
    {{flag}} 
</div>

并将其编译为<div class="red green">true</div>

在codepen或jsbin我不能复制，这是一些黑魔法在这里，因为昨天它运行良好，我没有碰它。我希望这里的某个人可以分享一个想法，为什么会发生这种情况，因为我完全停留在这一点上。当我删除两个条件中的任何一个时，剩下的一个工作正常 - 根据标志值设置正确的类。

UPDATE：关于三元操作数的所有建议都不会帮助我，因为在实际情况中我有复杂的条件，但它归结为单个相反的布尔变量差异。我已经将这种差异限制在2个条件之内，并且仅使用该布尔变量，但它仍然不起作用。精简的代码就是我发布的代码。

2017-02-15 pokrishka

“flag”对象的值是什么？ –

我裹在那里标志被设置为true到$超时的地方，它开始工作。不过，我仍然不明白，如果这是一个范围摘要问题，它怎么会在页面上显示true以及为什么这两个条件都满足了。一些量子力学双缝s ** t在那里。

2017-02-15 14:09:17 pokrishka

尝试使用这样的事情：

<div ng-class="{flag ? 'green' : 'red'}">

2017-02-15 11:29:27

什么OP正在尝试应该有工作..这是做同样的其他方式... –

使它有条件像：

<div ng-class="(flag) ? 'green' : 'red'">

或者

<div ng-class="{true:'green', false:'red'}[flag]"></div>

请注明是否能解决问题，因为这些只是其他使用ng-class指令的方法。

如果问题仍然存在，您可以指定值flag。它是不确定的吗？它是一个布尔值？ ...

2017-02-15 11:29:48

但OP正在尝试应该有工作..这是做同样的其他方式... –

是的100％正确。如果这有什么区别，他应该尝试。我已经更新了我的答案。 –

试试这个像这样

<div ng-class="flag ? 'green' : 'red'">

2017-02-15 11:41:36

回答