Как фильтровать по свойству, являющемуся пустым массивом?

у меня это на НГ-повторите

<tr ng-repeat="website in websites">
    <td>{{website.url}}</td>
</tr>

каждого website объект websites массив выглядит так:

{
  url: "example.com",
  groups: []
}

вопрос: как применить фильтр к выше петли, так что он показывает только элементы, где groups свойство является пустым массивом?

вещи, которые я пробовал:

data-ng-repeat="website in websites | filter: {groups: []}"
data-ng-repeat="website in websites | filter: !groups.length"
data-ng-repeat="website in websites | filter: groups.length === 0"

(нет ошибок в консоли, но отфильтровывает все)

data-ng-repeat="website in websites | filter: {groups: ''}"

(делает противоположное тому, что я хочу, и показывает только пункты, где groups не является пустым массивом)

data-ng-repeat="website in websites | filter: {groups: null}"

(если вместо [] я использую null для обозначения отсутствия значений, это работает, но кажется очень грязным...потому что мне нужно постоянно следить за groups свойство становится пустым и устанавливает его значение null вручную)

6
angularjs angularjs-ng-repeat

2 ответов

я добавил функцию фильтра в контроллере:

JS:

angular.module('myApp', [])
  .controller('myController', ['$scope',
    function($scope) {
      $scope.friends = [{
        name: 'John', phone: '555-1276', a: [1, 2, 3]
      }, { name: 'Mary',  phone: '800-BIG-MARY',  a: [1, 2, 3]
      }, { name: 'Mike', phone: '555-4321',  a: null
      }, { name: 'Adam', phone: '555-5678', a: []
      }, { name: 'Julie', phone: '555-8765', a: []
      }, { name: 'Juliette', phone: '555-5678', a: []
      }];

      $scope.filterFn = function(item) {
        // must have array, and array must be empty
        return item.a && item.a.length === 0;
      };

    }
  ]);

в вашем шаблоне:

<table>
  <tr><th>Name</th><th>Phone</th><th>array len</th></tr>
  <tr ng-repeat="friend in friends | filter: filterFn">
    <td>{{friend.name}}</td>
    <td>{{friend.phone}}</td>
    <td>{{friend.a.length}}</td>
  </tr>
</table>

модифицированный угловой фильтр doc plnkr

4

вы можете использовать такой параметр компаратора.

<tr ng-repeat="website in websites | filter:{groups: []}:true">
    <td>{{website.url}}</td>
</tr>

официальный документ Angularjs опишите значение true.

true: стенография функции (фактическая, ожидаемая) { return angular.равно (фактическое, ожидаемое)}. Это, по сути, строгое сравнение ожидаемого и фактического.

jsfiddle здесь.

2