JSON /オブジェクトのAngularJSフィルター

Question

私はAngularが初めてで、アイスクリームのシンプルなリストも作成しています。オブジェクト（各アイスクリームのオブジェクト）を含むJSONファイルからデータを取得します。すべてのオブジェクトには "beschikbaar"というプロパティがあり、 "Ja"または "Nee"に設定されます（仕事を簡単にする場合はtrueまたはfalseにすることもできます）。私がng-repeatで作ったリストでは、プロパティ "beschikbaar"が "Ja"またはtrueに設定されている項目のみを表示したいと考えています。さもなければ私はそれらを隠したいと思う。私はそれを行うことができません。

これを修正するには、ビュー内の単純なフィルタを使用するか、これを行うカスタムフィルタが必要ですか？私はexpがありません。カスタムフィルタを使用します。

私はすべての種類のことを試しましたが、現在のビューのフィルタは試しただけの例です。

私のコード

VIEW

 <ion-item ng-repeat="item in icecreams | filter: {item.beschikbaar}:Ja" class="item-thumbnail-left" href="#"> 
     <img src="http://placehold.it/100x100"> 
     <h2>{{ item.name }}</h2> 
     <p>{{ item.info }}</p> 
     <h4>{{ item.type }}</h4> 
     <h4>In de winkel tot: {{ item.end_date }}</h4> 
     </ion-item> 

JSON

[ 

     { 
      "name" : "Aardbei Sorbet", 
      "type" : "Sorbet", 
      "info" : "Aardbei sorbet ijs is een frisse en zoete ijssmaak. Heerlijk voor in de zomer met bijvoorbeeld slagroom en chocolade ijs. Gemaakt met Hollandse Aardbeien.", 
      "end_date" : "Maandag 17 Juli", 
      "ingre" : "Hollandse aardbeien, melk, water, vanille roomijs", 
      "suikervrij" : "Nee", 
      "gluten" : "Nee", 
      "beschikbaar" : "Ja"    
     }, 

     { 
      "name" : "Mango Sorbet", 
      "type" : "Sorbet", 
      "info" : "Mango sorbet ijs is een exotische smaak. Met dit ijs krijg je het gevoel alsof je in een ver en exotisch land bent. Gemaakt met echte mango. Lekker te combineren met Ananas ijs.", 
      "end_date" : "Maandag 17 Juli", 
      "ingre" : "Mango stukjes, citroensap, water, vruchtvlees ananas", 
      "suikervrij" : "Nee", 
      "gluten" : "Ja", 
      "beschikbaar" : "Ja"       
     }, 

     { 
      "name" : "Tompouchen ijs", 
      "type" : "Special", 
      "info" : "Een hema naast de winkel is garantie voor lekker ijs. Tompouchen ijs is een leuk experiment geworden. De romige smaak komt er in terug en ik heb er voor gezorgd dat hij niet extreem zoet is!", 
      "end_date" : "Maandag 17 Juli", 
      "ingre" : "Tompouchen, cakebeslag, room, melk, water", 
      "suikervrij" : "Nee", 
      "gluten" : "Ja", 
      "beschikbaar" : "Ja"    
     }, 

     { 
      "name" : "Drop ijs", 
      "type" : "Snoep", 
      "info" : "Ijs van drop, hoe tof is dat? Zoet van smaak, met een authentieke drop smaak. Gemaakt op basis van drop en vanille ijs.", 
      "end_date" : "Maandag 17 Juli", 
      "ingre" : "Tompouchen, cakebeslag, room, melk, water", 
      "suikervrij" : "Nee", 
      "gluten" : "Ja", 
      "beschikbaar" : "Nee" 
     } 

] 

コントローラ

.controller('MainController', ['$scope', '$http', function($scope, $http){ 

    $http.get('js/data.json').success(function(data) { 
    $scope.icecreams = data; 
    }); 

}]); 

私はこの主題の多くの疑問がある知っているが、私は単に」することができますそれを働かせてください。助けてくれてありがとう！

Answer 1

フィルタなしでこれを達成できます。ちょうどng-ifを使用してください。

<ion-item ng-repeat="item in icecreams" class="item-thumbnail-left" href="#" ng-if="item.beschikbaar == 'Ja'"> 
     <img src="http://placehold.it/100x100"> 
     <h2>{{ item.name }}</h2> 
     <p>{{ item.info }}</p> 
     <h4>{{ item.type }}</h4> 
     <h4>In de winkel tot: {{ item.end_date }}</h4> 
</ion-item>