Как использовать ng-if, ng-else в angularJS

Я хочу сравнить id.here, если id равно 5, сделайте это, иначе сделайте это. Как я могу достичь этого?

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

Ответ 1

Используйте ng-switch с выражением и ng-switch-when для сопоставления значения выражения:

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

Пример здесь

Angular2 пример

Ответ 2

Нет директивы для ng-else

Вы можете использовать ng-if для достижения if() {..} else {..} в angularJs.

Для вашей текущей ситуации

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

Ответ 3

Я добавляю некоторые из важных проблем в директивах ng: -

Директивы будут отвечать тому же месту, где оно выполняется.
ng-else нет, вы можете использовать только , если, или другой вкус, например switch.

Посмотрите пример ниже: -

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

В соответствии с типом данных он будет отображать любой из div.

Ответ 4

Вы также можете попробовать тройной оператор. Что-то вроде этого

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

Измените свой HTML-код немного и попробуйте эту надежду, так что это будет работать для вас.

Ответ 5

Синтаксис для ng, если else в angular:

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

Ответ 6

Вы можете написать как:

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