Angularjs if-then-else construction in expression Angularjs if-then-else construction in expression javascript javascript

Angularjs if-then-else construction in expression


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}}


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>