AngularJS通過獨特的屬性值進行過濾，並且過濾的數量

Question

我有以下陣列：

items: [ 
{ 
    id: "0", 
    name: "כיבוי אורות", 
    icon: "rooms_salon.svg", 
    type: "scenario", 
    status: 1 
}, 
{ 
    id: "1", 
    name: "הדלקת אורות", 
    icon: "rooms_salon.svg", 
    type: "scenario", 
    status: 1 
}, 
{ 
    id: "0", 
    name: "תנור מטבח", 
    icon: "rooms_salon.svg", 
    type: "heater", 
    status: 0 
}, 
{ 
    id: "1", 
    name: "מזגן מטבח", 
    icon: "rooms_salon.svg", 
    type: "ac", 
    status: 0 
}] 

我需要過濾，所以我得到的只有唯一的項目。形式和每個項目的原始量的數類型。

的堅決，我需要：

items: [ 
    { 
     type: "scenario", 
     amount: 2 
    }, 
    { 
     type: "heater", 
     amount: 1 
    }, 
    { 
     type: "ac", 
     amount: 1 
    } 
] 

什麼是這樣做的最好方法是什麼？

P.O：我需要在控制器中過濾它，而不是在ng-repeat中。

感謝配發

阿維

Answer 1

你是不是做了過濾，您需要創建所需的值的新數組。

或

創建這樣

function Ctrl($scope){ 
    $scope.items = [ 
     { 
      id: "0", 
      name: "כיבוי אורות", 
      icon: "rooms_salon.svg", 
      type: "scenario", 
      status: 1 
     }, 
     { 
      id: "1", 
      name: "הדלקת אורות", 
      icon: "rooms_salon.svg", 
      type: "scenario", 
      status: 1 
     }, 
     { 
      id: "0", 
      name: "תנור מטבח", 
      icon: "rooms_salon.svg", 
      type: "heater", 
      status: 0 
     }, 
     { 
      id: "1", 
      name: "מזגן מטבח", 
      icon: "rooms_salon.svg", 
      type: "ac", 
      status: 0 
     }]; 

    Object.defineProperty($scope, 'filtered', { 
     get: function(){ 
      var list = {}; 
      $scope.items.forEach(function (item) { 
       if (list[item.type] === undefined) { 
        list[item.type] = 1; 
       } else { 
        list[item.type] += 1; 
       } 
      });   
      var newItems = [];  
      Object.keys(list).forEach(function(key){  
       newItems.push({ 
       type :key, 
       amount: list[key] 
       });  
      }); 
      return newItems; 
     } 
    }); 
} 

一個計算濾波值

FIDDLE

Answer 2

您可以使用angular-filtermodule，以便將物品：

$scope.items = [ 
{ 
    id: "0", 
    name: "כיבוי אורות", 
    icon: "rooms_salon.svg", 
    type: "scenario", 
    status: 1 
}, 
{ 
    id: "1", 
    name: "הדלקת אורות", 
    icon: "rooms_salon.svg", 
    type: "scenario", 
    status: 1 
}, 
{ 
    id: "0", 
    name: "תנור מטבח", 
    icon: "rooms_salon.svg", 
    type: "heater", 
    status: 0 
}, 
{ 
    id: "1", 
    name: "מזגן מטבח", 
    icon: "rooms_salon.svg", 
    type: "ac", 
    status: 0 
}] 

$scope.content = $filter('countBy')($scope.items,'type'); 

這裏你有一個工作plunker