javascript - ejemplos - ngif angular 6

Angularjs if-then-else construcción en expresión

Question

¿Puedo usar de alguna manera la construcción if-then-else (ternary-operator) en la expresión angularjs, por ejemplo, tengo la función $ scope.isExists (item) que tiene que devolver el valor de bool. Quiero algo como esto,

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

Sé que puedo usar la función que devuelve cadena, soy interesante la posibilidad de usar la construcción if-then-else en la expresión. Gracias.

Answer 1

Las expresiones angulares no son compatibles con el operador ternario anterior a 1.1.5, pero se pueden emular de esta manera:

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

Entonces, en el ejemplo, algo como esto funcionaría:

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

ACTUALIZACIÓN: Angular 1.1.5 agregó soporte para operadores ternarios:

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

Answer 2

Puede usar el operador ternario desde la versión 1.1.5 y superior como se demuestra en este pequeño plunker (ejemplo en 1.1.5):

Por razones históricas (tal vez plnkr.co get down por alguna razón en el futuro) aquí está el código principal de mi ejemplo:

{{true?true:false}}

Answer 3

Puede usar fácilmente ng-show como:

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

Para pruebas más complejas, puede usar declaraciones ng-switch:

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