json配列フィールドを反復する

Question

javascriptのJSONオブジェクト/文字列内の配列フィールドをフィルタリングするチェックボックスに問題があります。

は、ここに私のHTMLです：元jsfiddleは、単一の項目の色フィールド、色のない配列のオフに基づいていた

$scope.fruit = [ 
     {'name': 'Apple', 'colour': ['Red']}, 
     {'name': 'Orange', 'colour': ['Red','Orange']}, 
     {'name': 'Banana', 'colour': ['Yellow','Orange']}]; 

：

<div ng-app="fruit"> 
    <div ng-controller="FruitCtrl"> 

     <input type="checkbox" ng-click="includeColour('Red')"/> Red</br/> 
     <input type="checkbox" ng-click="includeColour('Orange')"/> Orange</br/> 
     <input type="checkbox" ng-click="includeColour('Yellow')"/> Yellow</br/> 

     <ul> 
      <li ng-repeat="f in fruit | filter:colourFilter"> 
       {{f.name}} 
      </li> 
     </ul> 

     Filter dump: {{colourIncludes}} 
    </div> 
</div> 

はここに私のデータです。

original: 
{'name':'Apple','colour':'Red'} 

my version: 
{'name':'Apple','colour':['Red','Yellow']} 

そして、これはそれが濾過した方法です：私は試合を見つけることができない理由として

任意のアイデア：

$scope.colourFilter = function(fruit) { 
    if ($scope.colourIncludes.length > 0) { 
    var data = fruit.colour; 
     if ($.inArray(fruit.colour, $scope.colourIncludes) < 0) 
      return; 
    } 

    return fruit; 
} 

私はそうのようなフィルタリングしようとしていますか？私は正しく配列をスキャンしていないと思いますか？

Answer 1

for (var i in fruit){ 
    fruit[i].colour.forEach(function(color){ 
     console.log(color); 
    }); 
} 

このループは、カラー配列内の項目を1つずつ返します。

基本的にfruit.colorは定義されていないので、参照する配列のどのインデックスを指定していません。

つまり、fruit [0] .colour、fruit [1] .colour ...などが有効です。

Answer 2

あなたのコードは非常に私のために動作しませんでしたが、これは、少なくとも私は、各果物の色を印刷することができます：

$scope.colourFilter = function(f) { 

     angular.forEach(f.colour, function(color){ 
     console.log("Color is: "+color); 


    }); 

}