ng-repeat가 ng-repeat를 반환하면 div가 표시됩니다.

Question

ng-repeat가 null을 반환하면 div에 메시지가 포함 된 div를 표시하려고합니다. 내 ng-repeat에는 json을 단순하게 필터링하기위한 ng-if가 있습니다.

가 여기 내 HTML 모든

<ion-list> 
     <ion-item class="item-remove-animate" ng-repeat="uit in useritems" 
     ng-if="uit.catid == categoryI" type="item-text-wrap" > 
     <h2>{{uit.user}}</h2> 
     <p>{{uit.pass}}</p> 
     <ion-option-button class="button-assertive" ng-click="remove(uit.uniqueid)"> 
      Delete 
     </ion-option-button> 
     </ion-item> 
    </ion-list> 

    <!-- DIV to show message --> 
    <div class="someclass"> 
     SOME MSG 
    </div> 
    <!-- DIV to show message --> 

Answer 1

첫째, 난 당신이 사용자 정의 directive를 사용하는 것이 좋습니다. NG-반복의 실제 배열에

var someApp=angular.module('someApp', []); 
someApp.filter('customFilter', function() { 
     return function(input, uppercase) { 
     var out = []; 
     for (var i = 0; i < input.length; i++) { 
      if(input[i].catid == categoryI){ 
       out.push(input[i]); 
      } 
     } 
     return out; 
     } 
}); 

<div class="someclass" ng-show="!useritemsFiltered.length"> 
    SOME MSG 
</div> 

Answer 2

당신은 설정할 수 있습니다 alias을 아래와 같이 길이에 따라 사업부를 보여

<ion-item class="item-remove-animate" ng-repeat="uit in useritemsFiltered = (useritems | filter:customFilter)" type="item-text-wrap" > 
    <h2>{{uit.user}}</h2> 
    <p>{{uit.pass}}</p> 
    <ion-option-button class="button-assertive" ng-click="remove(uit.uniqueid)"> 
     Delete 
    </ion-option-button> 
</ion-item> 

귀하의 지침은 다음과 같아야합니다 :

<ion-list> 
    <ion-item class="item-remove-animate" ng-repeat="uit in useritems as filtered" 
    </ion-item> 
</ion-list> 

filtered 배열은 실제 useritems을 기반으로 항목을 필터링했습니다. 따라서 길이가 0 인 경우 div을 표시 할 수 있습니다.

<!-- DIV to show message --> 
<div class="someclass" ng-show="!filtered.length"> 
    SOME MSG 
</div> 
<!-- DIV to show message --> 

그냥 명확한 이해를 위해, 여기에 각 documentaion에서 alias_expression에 대한 설명입니다 alias_expression로 표현

변수 - 또한 다음 중간 저장 것 옵션 별칭 식을 제공 할 수 있습니다 필터를 적용한 후의 리피터 결과 일반적으로 필터는 리피터 에서 필터가 활성화되어 있지만 필터링 된 결과 집합이 비어있는 경우 특수 메시지를 렌더링하는 데 사용됩니다.

For example: item in items | filter:x 결과로 반복 항목의 부분이 결과로 표시되지만, 항목이 필터를 통해 처리 된 후에 만 ​​결과가 저장됩니다.