Фильтр Angularjs не равен нулю

Попытка отфильтровать элементы с определенным свойством, которое не равно null. Для:

var details = [{name:'Bill', shortDescription: null}, {name:'Sally', shortDescription: 'A girl'}]

Я хотел бы показать только один ли; один для салли. Это то, что я пробовал без успеха

<ul>
<li ng-repeat="detail in details | filter:{shortDescription:'!'}">
<p>{{detail.shortDescription}}</p>
</li>
</ul>

Любая идея, как я могу это сделать без создания настраиваемого фильтра? Или даже так, как будет выглядеть пользовательский фильтр?

Ответы

Ответ 1

Согласно https://github.com/angular/angular.js/issues/11573 для Angular >= 1.4, рекомендуется использовать '', который соответствует любому примитиву, кроме null/undefined.

<ul>
    <li ng-repeat="detail in details | filter:{shortDescription: ''}">
        <p>{{detail.shortDescription}}</p>
    </li>
</ul>

Ответ 2

Angular >= 1.3.16 до последнего (1.5.5 на момент написания/обновления) используйте '' (пустая строка) (или работает '!!')

<ul>
    <li ng-repeat="detail in details | filter:{shortDescription: ''}">
        <p>{{detail.shortDescription}}</p>
    </li>
</ul>

Пример: http://jsfiddle.net/TheSharpieOne/1mnachk6/

Angular >= 1.3.6 и <= 1.3.15 использовать '!null'

<ul>
    <li ng-repeat="detail in details | filter:{shortDescription: '!null'}">
        <p>{{detail.shortDescription}}</p>
    </li>
</ul>

Пример: http://jsfiddle.net/TheSharpieOne/4wxs67yv/

Angular >= 1.2 и <= 1.3.5 use '' (пустая строка) (или работает '!!')

<ul>
    <li ng-repeat="detail in details | filter:{shortDescription: ''}">
        <p>{{detail.shortDescription}}</p>
    </li>
</ul>

Пример: http://jsfiddle.net/TheSharpieOne/ovsqf17n/

Angular < 1,2 '!!'

<ul>
    <li ng-repeat="detail in details | filter:{shortDescription: '!!'}">
        <p>{{detail.shortDescription}}</p>
    </li>
</ul>

Пример: http://jsfiddle.net/TheSharpieOne/RGEdc/

В целом '!!' имеет лучшую поддержку, но '' (пустая строка) рекомендуется и предназначена для этого.

Ответ 3

Стоит отметить, что для использования решения с пустыми кавычками вам нужно оставить компаратор по умолчанию false. Вы, возможно, будете использовать для включения здесь в фильтры вашего контроллера, например:

const myAssessments = 
       this.filterFilter(this.assessments, {userId: this.user.id}, true);

Этот тип строкового фильтра не будет работать без окончательного true. Но вам нужно сбросить true или сделать его ложным для выполнения не нулевой проверки:

const activeAndHistoric = 
      this.filterFilter(filteredAssessments, {historicYear: ''}, false);

Ответ 4

Я думаю, что это легче читать

 <ul>
    <li ng-repeat="detail in details" ng-if="detail.shortDescription">
        <p>{{detail.shortDescription}}</p>
    </li>
 </ul>