2016-07-08 14 views
0

$ filterまたは$ grepを使って深いフィルタリングをすることはできません。配列内の角度フィルタリング配列

Iストアオブジェクトの配列を持って、各ストアのオブジェクトは、受注の配列が含まれています

vm.Stores:

[{ 
    Stores: [{ 
     Id: 1, 
     Orders: [{ 
      Id: 11, 
      Selected: true 
     }, { 
     { 
      Id: 12, 
      Selected: false 
     }] 
    }, { 
     Id: 2, 
     Orders: [{ 
      Id: 21, 
      Selected: false 
     }, { 
     { 
      Id: 22, 
      Selected: true 
     }] 
    }], 
}] 

私が選択したプロパティtrueで受注の配列をしたいです:

vm.selectedOrders:

[{ 
    Id: 11, 
    Selected: true 
}, { 
    Id: 22, 
    Selected: true 
}] 
012明らかに間違った

vm.selectedOrders = $filter('filter')(Stores.Orders, {'selected': true}); 

を:

は、これは私がしようとしているものです。私が試した他の方法は各ループにネストされていますが、私はこれらのオーダーを多く扱っていますので、効率的な方法が必要です。

私は自分の配列にオーダーをフラット化しようとしましたが、今は別のオブジェクト配列を管理しています。それは私のhtmlで使用されているオブジェクト配列ではないので一致しません。

ドキュメントは役に立たない。フィルターは https://docs.angularjs.org/guide/filter

およびパラメータの説明私のために右であるように見えるどれも非常に多くの方法で使用できるほとんど意味を作る

https://docs.angularjs.org/api/ng/filter/filter

の例では、上のベース

  1. です分度器
  2. には$ filter( 'filter')も含まれていません!

コンパレータとは何ですか?

+0

[0] .Orders:ビューにフィルタを使用して'。そうであれば、ストアをループして、選択した注文を構築することができます。あなたはまだループしているでしょうが、それぞれの 'Store'にしかありません。 –

答えて

0

私は角度の専門家ではありません。しかし、あなたの与えられた構造のためにあなたはそれが角度の抽象化または言語のコアを介して行われているかどうかに関係なく、ネストされたループを回避することはできません - 簡単な解決策は、そのように見えるかもしれません...

var 
    Stores = [{ 
     Id: 1, 
     Orders: [{ 
      Id: 11, 
      Selected: true 
     }, { 
      Id: 12, 
      Selected: false 
     }] 
    }, { 
     Id: 2, 
     Orders: [{ 
      Id: 21, 
      Selected: false 
     }, { 
      Id: 22, 
      Selected: true 
     }] 
    }], 

    selectedOrders = Stores.reduce(function (collector, store) { 

     collector = collector.concat(
      store.Orders.filter(function (order) { 

       return order.Selected; 

      })/*.map(function (order) { 
       return { 
        storeId: store.Id, 
        orderId: order.Id 
       }; 
      })*/ 
     ); 
     return collector; 

    }, []); 

console.log("selectedOrders : ", selectedOrders); 
+0

ああ。 $ filterやgrepの全体のポイントは、このように深くできると思った。どうも。 – DaveC426913

+0

@ DaveC426913 ...まあ、結局のところJavaScriptです。 APIを介した単純で見やすい抽象化は、パフォーマンスマジックを行うことはできません。それはさらに多くのプロセスを上に追加します。 –

0

あなたは単にそれを行うことができます私は私の前に角度のプロジェクトを持っていない...しかし、私の記憶が正しければ、あなたが `店舗に行くことができるはず

(function() { 
 
    "use strict"; 
 
    angular.module('app', []) 
 
    .controller('mainCtrl', function() { 
 
     var vm = this; 
 

 
     vm.stores = [ 
 
     { 
 
      "Id":1, 
 
      "Orders":[ 
 
       { 
 
        "Id":11, 
 
        "Selected":true 
 
       }, 
 
       { 
 
        "Id":12, 
 
        "Selected":false 
 
       } 
 
      ] 
 
     }, 
 
     { 
 
      "Id":2, 
 
      "Orders":[ 
 
       { 
 
        "Id":21, 
 
        "Selected":false 
 
       }, 
 
       { 
 
        "Id":22, 
 
        "Selected":true 
 
       } 
 
      ] 
 
     } 
 
     ]; 
 
    }); 
 
})();
<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> 
 
</head> 
 

 
<body ng-controller="mainCtrl as main"> 
 
    <ul> 
 
    <li ng-repeat-start="store in main.stores" ng-bind="store.Id"></li> 
 
    <ul ng-repeat-end ng-repeat="order in store.Orders | filter: { Selected: true }"> 
 
     <li ng-bind="'Id:' + order.Id"></li> 
 
    </ul> 
 
    </ul> 
 
</body> 
 

 
</html>

+0

私の見解は私のモデルを反映していません。 – DaveC426913

+0

私はあなたを得ていませんでした..あなたはどういう意味ですか? – developer033

+0

@ DaveC426913、問題なく動作していますか? – developer033

関連する問題