0

私はブール値によって制御可能な工場からデータをフィルタリングしようとしています。私は何が間違っているのか分かりません。それは確かに文法であり、私自身は角の正しさを理解していません。私はここで凍ってしまったし、過去を過ごすことはできません。私は製品リストを表示して、ng-repeatディレクティブとカスタムフィルタでフィルタリングしています。カスタムの共有データを角度でフィルタリングする

.filter('promos'[ 
    '$scope', '$http', 'FilterData', 'ProductData', function(
    $scope, $http, FilterData, ProductData){ 
    $scope.filterData = FilterData; 
    $scope.products = ProductData; 

    angular.forEach(products, function(product){ 
     var promoProducts = []; 
     //booleen filters- if all or none selected do nothing - full product list 
     if ($scope.filterData.topChoices[0].selected &&  $scope.filterData.topChoices[1].selected && $scope.filterData.topChoices[2].selected || $scope.filterData.topChoices[0].selected === false && $scope.filterData.topChoices[1].selected === false && $scope.filterData.topChoices[2].selected === false) {} 
     else { 
     //if option selects, show corresponding products 
     if ($scope.filterData.topChoices[0].selected && product.onPromotion) {promoProducts.push} 
     if ($scope.filterData.topChoices[1].selected && product.hotSeller) {promoProducts.push} 
     if ($scope.filterData.topChoices[2].selected && product.freeShip) {promoProducts.push} 
     return promoProducts; 
     } 
    }); 
}]) 

ここ&工場がplunkerで見ることができるコントローラー[http://plnkr.co/edit/EDZPOPh7iMFSpPjO6AkI?p=preview][1] はhtmlです:

<div ng-controller="prodCtrl"> 
    <md-input-container class="md-icon-float md-icon-right md-block"> 
     <label>Low Price</label> 
     <md-icon md-font-icon="fa fa-money"></md-icon> 
     <input ng-model="filterData.price.low" type="number" step="5"> 
     <md-icon md-svg-src="img/icons/ic_euro_24px.svg"></md-icon> 
    </md-input-container> 
    <md-input-container class="md-icon-float md-icon-right md-block"> 
     <label>High Price</label> 
     <md-icon md-font-icon="fa fa-money"></md-icon> 
     <input ng-model="filterData.price.high" type="number" step="5"> 
     <md-icon md-svg-src="img/icons/ic_euro_24px.svg"></md-icon> 
    </md-input-container> 
    <md-checkbox style="margin-left: 15px;" class="md-secondary" ng-model="filterData.topChoices[0].selected"> Show Promotions <br><span style="font-size: 10px; color: blue;" ng-if="filterData.topChoices[0].selected">selected</span> </md-checkbox> 
    <md-checkbox style="margin-left: 15px;" class="md-secondary" ng-model="filterData.topChoices[1].selected"> Show Hot Sellers<br><span style="font-size: 10px; color: blue;" ng-if="filterData.topChoices[1].selected">selected</span> </md-checkbox> 
    <md-checkbox style="margin-left: 15px;" class="md-secondary" ng-model="filterData.topChoices[2].selected"> Show Free Shipping<br><span style="font-size: 10px; color: blue;" ng-if="filterData.topChoices[2].selected">selected</span> </md-checkbox> 
    </div> 
    <md-subheader class="md-no-sticky">Avatar with Secondary Action Icon</md-subheader> 
<md-list ng-Controller="prodCtrl"> 
    <md-list-item ng-repeat="product in products | filter:promos" ng-click class="noright"> 
    <ul> 
     <h3>{{product.name}} </h3> 
     <p>{{product.desc}}</p> 
    </ul> 
    <ul class="md-secondary"> 
     <li style="list-style: none;" ng-if="product.onPromotion">On Promotion!</li> 
     <li style="list-style: none;" ng-if="product.hotSeller">Hot-Seller!</li> 
     <li style="list-style: none;" ng-if="product.freeShip">Free Shipping!</li> 
    </ul> 
    <ul class="md-secondary" style="margin-right: 25px;"> 
     <li style="list-style: none;" ng-repeat="item in product.sellers | orderBy: item.price"> 
      {{item.seller}} ${{item.price}}</li> 
    </ul> 
    <md-button class="md-raised md-primary md-secondary">Buy</md-button> 
    </md-list-item> 
</md-list> 

正しい方向に私を入れて助けてください。私は地図で製品データを使うので、私は工場を借りている。だから私はこれが最善のルートだと思っています。

+0

を行います塊りの作業フォーク。 [link](http://plnkr.co/edit/zsDIWdi6lRuio3Gj4dff?p=info) –

+0

うわー。そのプッシャーは実際にそのトリックをしました。私は論理を得る。助けてくれてありがとう! –

+0

回答セクションに投稿すると、回答としてマークすることはできますか? –

答えて

1

これはコード

HERESにフィルタ から削除$ httpと$スコープの依存作業fiddle

var pusher = function(main, toPush) { 
       var alreadyPresent = false; 
       angular.forEach(main, function(toCheck) { 
       if (toCheck === toPush) { 
        alreadyPresent = true; 

       } 
       }) 
       if (!alreadyPresent) { 
       main.push(toPush); 
       } 
      } 



      var p = []; 
      angular.forEach(products, function(product) { 
       if (FilterData.topChoices[0].selected && 
       FilterData.topChoices[1].selected && FilterData.topChoices[2].selected || FilterData.topChoices[0].selected === false && FilterData.topChoices[1].selected === false && FilterData.topChoices[2].selected === false) {} else { 
       //if 
       if (FilterData.topChoices[0].selected && product.onPromotion) { 
        pusher(p, product); 
       } 
       if (FilterData.topChoices[1].selected && product.hotSeller) { 
        pusher(p, product); 
       } 
       if (FilterData.topChoices[2].selected && product.freeShip) { 
        pusher(p, product); 
       } 
       console.log('ppp') 
       console.log(p); 
       console.log('--ppp') 


       } 
      }) 
      return p; 

をフィルタリングし、フィルタを使用するためにあなたの中に行くだろうがHERESに

<md-list-item ng-repeat="product in products | promo" ng-click class="noright"> 
+0

素晴らしい私はコントローラを介してフィルタリングされたデータにアクセスしようとしていない(後で小冊子のデータをマップするためにフィルタを適用する必要がある)ので、指示を使わずに赤と一致するように緑を得る方法についてのヒント? http://plnkr.co/edit/HwNGFRuENleiSwVFfnhv?p=preview –

+0

私は週末後にそれを手伝うことができます。 –

+0

$ rooscope.emitを使って取得できました –

関連する問題