0

enter image description here 私はオブジェクトの配列を持っているので、私は繰り返していて美しく動作しますが、プロパティ値が 'true'のオブジェクトの配列をリストしたいと思います。私はangualrフィルターが十分であるはずです。しかし、それを働かせないでください特定のプロパティがfalseの場合、オブジェクトの角度フィルタリング配列ですか?

ここに私の試みです。 {無効:真}は正常に動作します基本的に私は実際に

<md-virtual-repeat-container id="vertical-container" ng-show="$ctrl.infiniteAssets.getLength() > 0 && $ctrl.switch"> 

     <md-list> 
     <md-list-item class="list-page" md-on-demand md-virtual-repeat="asset in $ctrl.infiniteAssets | assetsFilter:$ctrl.searchValue | filter:{disabled:true}:true" ng-click="$ctrl.loadDetail(asset)"> 
      <span class="search-status" style="border-left-color:{{asset.statusColor}};"></span> 
      <p >{{asset.name}} </p>     
      <label hide-xs ng-if="asset.disabled" class="ng-animate-disabled"> 
      <md-chips> 
       <md-chip >{{'LABELS.DISABLED' | translate}}</md-chip> 
      </md-chips> 
      </label> 
      <label ><i>{{asset.status || 'UNKNOWN'}}</i></label> 
      <md-button aria-label="Delete Asset" class="md-icon-button md-warn" layout-padding ng-click="$ctrl.deleteAsset(asset)"> 
        <md-icon md-svg-icon="delete" class="modelTrashIcon"></md-icon> 
       </md-button> 

      <md-divider></md-divider> 
     </md-list-item> 
     </md-list> 
    </md-virtual-repeat-container> 

$onInit =() => { 
 
     this.swtich   = false; 
 
     this.hideToolbarTools = false; 
 
     this.searchOpen  = false; 
 
     this.componentList = []; 
 
     this.alertCount  = 0; 
 
     this.loading   = false; 
 
     this.disableTitle  = false; 
 
     this.searchValue  = ""; 
 
     this.first   = true; 
 
     this.settings   = { 
 
         printLayout: true, 
 
         showRuler: true, 
 
         showSpellingSuggestions: true, 
 
         presentationMode: 'edit' 
 
     }; 
 

 
     this.global = this.$rootScope; 
 

 
     this.$rootScope.$on('transform-toolbar-open',() => { 
 
      //hide toolbar controls on mobile 
 
      
 
      if(this.$mdMedia('xs')){ 
 
       this.hideToolbarTools = true;   
 
      }else{ 
 
       this.hideToolbarTools = false 
 
      } 
 
     }) 
 

 
     this.$rootScope.$on('transform-toolbar-close',() => { 
 
      //show toolbar controls 
 
      this.hideToolbarTools = false; 
 
     }) 
 
     this.loadAssets() 
 
    } 
 

 

 
     loadAssets =() => { 
 

 
     var self = this; 
 
     self.infiniteAssets = { 
 
      numLoaded_: 0, 
 
      toLoad_: 0, 
 
      items: [], 
 
      pageNum:1, 
 
      virtualIndex:0, 
 

 
      getItemAtIndex: function (index) { 
 
       this.virtualIndex=index; 
 

 
       if (index > this.numLoaded_) { 
 
        this.fetchMoreItems_(index); 
 
        return null; 
 
       } 
 
       return this.items[index]; 
 
      }, 
 

 
      // Required. 
 
      getLength: function() { 
 
       if (this.virtualIndex > this.numLoaded_) { 
 
        return this.numLoaded_ ; 
 
       }else{ 
 
        return this.numLoaded_ + 5 ; 
 
       } 
 
      }, 
 

 
      fetchMoreItems_ : function (index) { 
 
       if (this.toLoad_ < index) { 
 
        self.loading = true; 
 
        this.toLoad_ += 20; 
 
        self.siAsset.getAssets(this.pageNum++,20) 
 
         .then(angular.bind(this, function (assets) { 
 
          //this.objLength = assets.length; 
 
          if(! assets.statusCode){ 
 
           this.items = this.items.concat(assets); 
 
           this.toLoad_ = this.items.length; 
 
           this.numLoaded_ = this.toLoad_; 
 
          } 
 
          self.loading = false; 
 
         })) 
 
       } 
 
      } 
 
      
 
     }; 
 
     console.log('check',this.infiniteAssets) 
 
    }

答えて

0

-repeat私は無効なもののためのまったく新しい関数を作成し、達成するためにはJavaScriptフィルタを使用することを決定しますこの機能

if(! asset.statusCode){ 
 
           let disabled = asset.filter((a)=>{        
 
           return a.disabled ==true 
 
          }) 
 
           this.items = this.items.concat(disabled); 
 
           this.toLoad_ = this.items.length; 
 
           this.numLoaded_ = this.toLoad_; 
 
          }

0

'真' asset.name、asset.statusなどdisabledプロパティを持つオブジェクトのフィルタが欲しいです。それが動作していない場合は

は、私はあなたが

var infiniteAssets = $filter('filter')(infiniteAssets,{disabledled:true}) 
+0

どのように私はそれを実装するのでしょうか?私はthis.finite = this。$ filter( 'filter')(infiniteAssets、{disabledled:true})と言って、$ ctrl.finiteのアセットを宣言しようとしました。働いていない。 –

0

はあなたがNGの下NG-かの条件を入れて試すことができ、角度フィルタを

var infiniteAssets = infiniteAssets.filter(i=>i.disabled == true); 

としてあなたのスクリプト側でそれらをフィルタリングしたり、使用することができると思います

<md-virtual-repeat-container id="vertical-container" ng-show="$ctrl.infiniteAssets.getLength() > 0 && $ctrl.switch"> 

     <md-list> 
     <md-list-item class="list-page" md-on-demand md-virtual-repeat="asset in $ctrl.infiniteAssets ng-click="$ctrl.loadDetail(asset)"> 
     <div ng-if="asset.disabled">    
     <span class="search-status" style="border-left-color:{{asset.statusColor}};"></span> 
      <p >{{asset.name}} </p>     
      <label hide-xs ng-if="asset.disabled" class="ng-animate-disabled"> 
      <md-chips> 
       <md-chip >{{'LABELS.DISABLED' | translate}}</md-chip> 
      </md-chips> 
      </label> 
      <label ><i>{{asset.status || 'UNKNOWN'}}</i></label> 
      <md-button aria-label="Delete Asset" class="md-icon-button md-warn" layout-padding ng-click="$ctrl.deleteAsset(asset)"> 
        <md-icon md-svg-icon="delete" class="modelTrashIcon"></md-icon> 
       </md-button> 

      <md-divider></md-divider> 
      </div> 
     </md-list-item> 
     </md-list> 
    </md-virtual-repeat-container> 
+0

ちょっと前に、ng-if = asset.disabledのそれぞれを入れて試してみましたが、urのようなdivにラップしてしまいました。両方のオブジェクトで、まだ存在し、クリックすることができます。テキストだけが隠れて見えます。 https://www.dropbox.com/s/zlqkwtq3s7vs4nn/Capture.PNG?dl=0 –

関連する問題