在AngularJs

Question

我有對象的數組使用自定義過濾器應用顏色的項目：

 [ 
      { 
      idPriority: 1, 
      priority: "Critical", 
      isChecked: 0 
      }, 
      { 
      idPriority: 2, 
      priority: "High", 
      isChecked: 0 
      }, 
      { 
      idPriority: 3, 
      priority: "Medium", 
      isChecked: 0 
      }, 
      { 
      idPriority: 4, 
      priority: "Low", 
      isChecked: 0 
      } 
     ] 

我想用NG-重複顯示一個表格，這裏面的數據和應用自定義過濾器，例如，如果優先對象高或關鍵時，應以紅色顯示，如果優先級爲中或低，則應以黃色顯示。它甚至有可能嗎？

Answer 1

你可以用不同的款式可根據優先級

<tr ng-repeat=" item in items"> 
    <td> 
     <span class="style for red" ng-show="item.priority=='Critical'">Critical</span> 
     <span class="style for yellow" ng-show="item.priority=='High'">High</span> 
     <span class="style for green" ng-show="item.priority=='Medium'">Medium</span> 
    </td> 
</tr> 

，或者如果你想有一個自定義過濾器，你可以創建一個過濾器的值來創建不同的列而改變自己的知名度並設置其類也

$scope.filterPriority = function (item) { 
    if (item.priorty == 'High') { 
     item.class = 'class for high'; 
    } 
    else if (item.priorty == 'Low') { 
     item.class = 'class for low'; 
    } 
    else { 
     item.class = 'default class'; 
    } 

    return true; 
}; 

，並在你的HTML

<table> 
<tr ng-repeat=" item in items | filter:filterPriority"> 
<td> 
    <span class="{{item.class}}"></span> 
</td>       
</tr> 

Answer 2

您可以使用CSS來實現此目的。例如 <tr class="{{ item.priority }}"> some content</tr>

會添加適當的類。某處在樣式表

.Critical { color: red; } 
.High { color: blue; } 
.Medium { color: green; }