ng-if и проверка на непустой, ненулевой объект

Question

Я пытаюсь это:

<select ng-disabled="!items" class="form-control" ng-model="selected" ng-options="key as value for (key , value) in items">
    <option ng-if="items" value="">All Items</option>
</select>

Но All Items опция не отображается, когда есть предметы.

Примечание: проблема связана с ng-if, ничего больше.

ДЕМО: http://plnkr.co/edit/jarknWGYXiHdGIWNtMvC?p=preview

Answer 1

Вы можете проверить, пустой ли идентификатор объекта, как это

$scope.isEmpty = function (obj) {
for (var i in obj) if (obj.hasOwnProperty(i)) return false;
return true;
};

и в представлении вы можете сделать:

 <option ng-show="!isEmpty(items)">All Items</option>

ng-if здесь не работает в теге option - это может произойти из-за того, что элемент select находится выше в DOM-дереве, чем нулевой параметр с помощью ng-if, поэтому он будет компилироваться первым. увидеть угловой источник

Answer 2

Это был хороший вариант для меня:

angular
  .module('myApp')
  .filter('empty', function() {
    return function(obj) {
      return obj === null || angular.equals({}, obj)
    }
  })

<span ng-if="items|empty">0 items</span>

Добавление функции в качестве фильтра и использование Angular для тестирования.

Спасибо @Hmahwish за вдохновение.