ng-if，不等於？

Question

我有一個簡單的ng-reapt，顯示值的列表..在一些輸出，我有幾個ng - 如果顯示/隱藏DIVs。

HTML：

<div ng-repeat="details in myDataSet"> 

    <p>{{ details.Name }}</p> 
    <p>{{ details.DOB }}</p> 

     <div ng-if="details.Payment[0].Status == '0'"> 
      <p>No payment</p> 
     </div> 

     <div ng-if="details.Payment[0].Status == '1' || details.Payment[0].Status == '2'"> 
      <p>Late</p> 
     </div> 

     <div ng-if="details.Payment[0].Status == '3' || details.Payment[0].Status == '4' || details.Payment[0].Status == '5'"> 
      <p>Some payment made</p> 
     </div> 

     <div ng-if="details.Payment[0].Status == '6'"> 
      <p>Late and further taken out</p> 
     </div> 

     <div ng-if="details.Payment[0].Status != '0' || details.Payment[0].Status != '1' || details.Payment[0].Status != '2' || details.Payment[0].Status != '3' || details.Payment[0].Status != '4' || details.Payment[0].Status != '5' || details.Payment[0].Status != '6'"> 
      <p>Error</p> 
     </div> 

    <p>{{ details.Gender}}</p> 

</div> 

試圖顯示!=部時我的應用程序被顯示錯誤。

Answer 1

這是更好地使用NG-開關

<div ng-switch on="details.Payment[0].Status"> 
    <div ng-switch-when="1"> 
     <!-- code to render a large video block--> 
    </div> 
    <div ng-switch-default> 
     <!-- code to render the regular video block --> 
    </div> 
</div> 

Answer 2

這是在諧音所有不必要的邏輯，將其降低到這樣的事情並處理控制器/服務中的數據，它應該是

<div ng-repeat="details in myDataSet"> 

    <p>{{ details.Name }}</p> 
    <p>{{ details.DOB }}</p> 
    <p>{{details.Payment[0].StatusName}}</p> 
    <p>{{ details.Gender}}</p> 

</div> 

JS：

angular.forEach(myDataSet.Payment, function (payment) { 
    if(payment.Status === 0){ 
    payment.StatusName = 'No Payment'; 
    } else if(payment.Status === 1 || payment.Status === 2){ 
    payment.StatusName = 'Late'; 
    } else if(payment.Status === 3 || payment.Status === 4 || payment.Status === 5){ 
    payment.StatusName = 'Some payment made'; 
    } else if(payment.Status === 6){ 
    payment.StatusName = 'Late and further taken out'; 
    }else{ 
    payment.StatusName = 'Error'; 
    } 
}) 

Answer 3

這裏是具有過濾器的極好的解決方案：

app.filter('status', function() { 

    var statusDict = { 
    0: "No payment", 
    1: "Late", 
    2: "Late", 
    3: "Some payment made", 
    4: "Some payment made", 
    5: "Some payment made", 
    6: "Late and further taken out" 
    }; 

    return function(status) { 
    return statusDict[status] || 'Error'; 
    }; 
}); 

標記：

<div ng-repeat="details in myDataSet"> 
    <p>{{ details.Name }}</p> 
    <p>{{ details.DOB }}</p> 
    <p>{{ details.Payment[0].Status | status }}</p> 
    <p>{{ details.Gender}}</p> 
</div> 

Answer 4

試試這個：

ng-if="details.Payment[0].Status != '6'". 

對此深感抱歉，但我認爲你可以使用NG-顯示或NG隱藏。

Answer 5

我不喜歡「黑客」，但在快速捏了最後期限我已經這樣做了

<li ng-if="edit === false && filtered.length === 0"> 
    <p ng-if="group.title != 'Dispatcher News'" style="padding: 5px">No links in group.</p> 
</li> 

是的，我有另一個內部嵌套NG-如果，我只是不喜歡太多條件在一條線上。

Answer 6

嘗試下面的解決方案

ng-if="details.Payment[0].Status != '0'" 

Use below condition(! prefix with true condition) instead of above 

ng-if="!details.Payment[0].Status == '0'" 

Answer 7

有相當不錯的解決方案，在這裏，但他們不幫助理解爲什麼這個問題實際發生。

但它很簡單，你只需要瞭解邏輯OR ||的工作原理。當其任一邊評估爲true時，整個表達式將評估爲true。

現在讓我們看看你的情況。假設整個details.Payment[0].Status是Status，這是一個簡潔的數字。那麼我們有Status != 0 || Status != 1 || ...。

想象Status = 1：

(1 != 0 || 1 != 1 || ...) = 
( true || false || ...) = 
(  true  || ...) = ... = true 

現在想象Status = 0：

(0 != 0 || 0 != 1 || ...) = 
(false || true || ...) = 
(  true  || ...) = ... = true 

如你，它甚至不不管你有什麼作爲前兩個表達式的...作爲邏輯OR給你true這將是充分表達的結果。

你真正需要的是邏輯AND&&這將是真實的，只有當都其兩側是true。

Answer 8

現在這是可能的AngularJS 1.5.10，採用ng-switch-when-separator

var app = angular.module("app", []); 
 

 
app.controller("ctrl", function($scope) { 
 
    $scope.myDataSet = [{Name: 'Michelle', Gender: 'Female', DOB: '01/12/1986', Payment: [{Status: '0'}]},{Name: 'Steve', Gender: 'Male', DOB: '11/12/1982', Payment: [{Status: '1'}]},{Name: 'Dan', Gender: 'Male', DOB: '03/22/1976', Payment: [{Status: '2'}]},{Name: 'Doug', Gender: 'Male', DOB: '02/02/1980', Payment: [{Status: '3'}]},{Name: 'Mary', Gender: 'Female', DOB: '04/02/1976', Payment: [{Status: '4'}]},{Name: 'Cheyenne', Gender: 'Female', DOB: '07/10/1981', Payment: [{Status: '5'}]},{Name: 'Bob', Gender: 'Male', DOB: '02/16/1990', Payment: [{Status: '6'}]},{Name: 'Bad data', Gender: 'Blank', DOB: '01/01/1970', Payment: [{Status: '7'}]}]; 
 
});

<script src="https://code.angularjs.org/1.5.10/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="ctrl"> 
 
    <div ng-repeat="details in myDataSet" ng-switch on="details.Payment[0].Status"> 
 

 
     <p>{{ details.Name }}</p> 
 
     <p>{{ details.DOB }}</p> 
 

 
     <div ng-switch-when="0"> 
 
      <p>No payment</p> 
 
     </div> 
 

 
     <div ng-switch-when="1|2" ng-switch-when-separator="|"> 
 
      <p>Late</p> 
 
     </div> 
 

 
     <div ng-switch-when="3|4|5" ng-switch-when-separator="|"> 
 
      <p>Some payment made</p> 
 
     </div> 
 

 
     <div ng-switch-when="6"> 
 
      <p>Late and further taken out</p> 
 
     </div> 
 

 
     <div ng-switch-default> 
 
      <p>Error</p> 
 
     </div> 
 
     
 
     <p>{{ details.Gender}}</p> 
 

 
    </div> 
 
</div>