Angularjs if-then-else 表达式构造

我可以在 angularjs 表达式中以某种方式使用 if-then-else 构造(三元运算符)吗? 例如，函数 $scope.isExists (item)必须返回 bool 值。 我想要这样的东西,

<div ng-repeater="item in items">
<div>{{item.description}}</div>
<div>{{isExists(item) ? 'available' : 'oh no, you don't have it'}}</div>
</div>

我知道我可以使用返回字符串的函数，我对在表达式中使用 if-then-else 构造的可能性很感兴趣。 谢谢。

200526 次浏览
小开

You can easily use ng-show such as :

    <div ng-repeater="item in items">
<div>\{\{item.description}}</div>
<div ng-show="isExists(item)">available</div>
<div ng-show="!isExists(item)">oh no, you don't have it</div>
</div>

For more complex tests, you can use ng-switch statements :

    <div ng-repeater="item in items">
<div>\{\{item.description}}</div>
<div ng-switch on="isExists(item)">
<span ng-switch-when="true">Available</span>
<span ng-switch-default>oh no, you don't have it</span>
</div>
</div>
小开
最佳答案

Angular expressions do not support the ternary operator before 1.1.5, but it can be emulated like this:

condition && (answer if true) || (answer if false)

So in example, something like this would work:

<div ng-repeater="item in items">
<div>\{\{item.description}}</div>
<div>\{\{isExists(item) && 'available' || 'oh no, you don't have it'}}</div>
</div>

UPDATE: Angular 1.1.5 added support for ternary operators:

\{\{myVar === "two" ? "it's true" : "it's false"}}
小开

You can use ternary operator since version 1.1.5 and above like demonstrated in this little plunker (example in 1.1.5):

For history reasons (maybe plnkr.co get down for some reason in the future) here is the main code of my example: 

\{\{true?true:false}}
小开

This can be done in one line. 

\{\{corretor.isAdministrador && 'YES' || 'NÂO'}}

Usage in a td tag:

<td class="text-center">\{\{corretor.isAdministrador && 'Sim' || 'Não'}}</td>
小开

I am trying to check if a key exist in an array in angular way and landed here on this question. In my Angularjs 1.4 ternary operator worked like below

\{\{ CONDITION ? TRUE : FALSE }}

hence for the array key exist i did a simple JS check

Solution 1 : \{\{ array['key'] !== undefined ? array['key'] : 'n/a' }}

Solution 2 : \{\{ "key" in array ? array['key'] : 'n/a' }}


提交答案