angularjs - else - ngif angular 4 example

Cómo hacer uso de ng-if, ng-else en angularJS

Question

Quiero comparar id.here si id es igual a 5 haz esto, de lo contrario hazlo. ¿Cómo puedo conseguir esto?

<div class="case" data-ng-if="data.id === ''5'' ">
    <input type="checkbox" id="{{data.id}}" value="{{data.displayName}}"
            data-ng-model="customizationCntrl.check[data.id1]"
            data-ng-checked="{{data.status}}==''1''" onclick="return false;">{{data.displayName}}
        <br>
</div>
<div class="case" data-ng-else>
    <input type="checkbox" id="{{data.id}}" value="{{data.displayName}}"
            data-ng-model="customizationCntrl.check[data.id]"
            data-ng-checked="{{data.status}}==''1''">{{data.displayName}}<br>
</div> 

Answer 1

Estoy agregando algunas de las preocupaciones importantes sobre las directivas de ng :

1. Las directivas responderán el mismo lugar donde se ejecute.
2. El concepto ng-else no está allí, puede hacerlo solo si , u otro tipo de instrucción de cambio, como el cambio .

Echa un vistazo al siguiente ejemplo:

<div ng-if = "data.type == ''FirstValue''">

//different template with hoot data

</div>

<div ng-if = "data.type == ''SecondValue''">

  //different template with story data

</div>

<div ng-if = "data.type == ''ThirdValue''">

 //different template with article data

</div>

Según el tipo de datos, se procesará cualquiera de los div.

Answer 2

La sintaxis para ng si no en angular es:

<div class="case" *ngIf="data.id === ''5''; else elsepart; ">
    <input type="checkbox" id="{{data.id}}" value="{{data.displayName}}" 
    data-ng-model="customizationCntrl.check[data.id1]" data-ng-checked="
    {{data.status}}==''1''" onclick="return false;">{{data.displayName}}<br>
</div>
<ng-template #elsepart>
    <div class="case">
        <input type="checkbox" id="{{data.id}}" value={{data.displayName}}"  
        data-ng-model="customizationCntrl.check[data.id]" data-ng-checked="
        {{data.status}}==''1''">{{data.displayName}}<br>
    </div> 
</ng-template>

Answer 3

No hay directiva para ng-else

Puede usar ng-if para lograr si () {..} else {..} en angularJs.

Para su situación actual,

<div ng-if="data.id == 5">
<!-- If block -->
</div>
<div ng-if="data.id != 5">
<!-- Your Else Block -->
</div>

Answer 4

Puedes escribir como:

<div class="case" ng-if="mydata.id === ''5'' "> <p> this will execute </p> </div> <div class="case" ng-if="mydata.id !== ''5'' "> <p> this will execute </p> </div>

Answer 5

También puedes probar el operador ternario. Algo como esto

{{data.id === 5 ? "it''s true" : "it''s false"}}

Cambie un poco su código html e intente esta esperanza para que le resulte útil.

Answer 6

Use ng-switch con expresión y ng-switch-when para hacer coincidir el valor de expresión:

<div ng-switch="data.id">
  <div ng-switch-when="5">...</div>
  <div ng-switch-default>...</div>
</div>

El ejemplo esta aqui

Ejemplo angular2

Answer 7

<div class="case" ng-if="mydata.id === ''5'' ">
    <p> this will execute </p>
</div>
<div class="case" ng-if="mydata.id !== ''5'' ">
    <p> this will execute </p>
</div> 

prueba este código aquí el valor de VerifyName.indicator proviene del controlador. esto funciona para mi