Филтърът Angularjs не е нулев

Опитвате се да филтрирате елементи с определено свойство, което не е null Така че за:

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

Бих искал да покажа само едно li; тази за сали. Това е, което опитах без успех

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

Някаква идея как мога да направя това, без да създавам персонализиран филтър? Или дори да е така, как ще изглежда персонализираният филтър?


javascript angularjs angularjs-filter
person Scotty Bollinger    schedule 05.09.2013    source източник
comment
Различно решение: stackoverflow.com/a/24992197/257470   -  person andrew.fox    schedule 01.09.2017

Отговори (4)


arrow_upward
42
arrow_downward

Според 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>
person skalb    schedule 24.06.2015
comment
Благодаря за публикацията! - person James Drinkard; 09.08.2016
comment
Работи, благодаря. Но в този случай синтаксисът на angularjs е абсурден (filter--). - person MCurbelo; 05.06.2017
comment
@MCurbelo, моят любим синтаксис на филтъра е, че думата филтър е двусмислена. Филтрира ли се за нулеви описания? Или филтриране на извън нулеви описания? Не можете да разберете, като погледнете кода. По-добро име би било filterOut или showOnly (с подходяща семантика). - person user2023861; 06.09.2017

arrow_upward
123
arrow_downward

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 използват '' (празен низ) (или '!!' също работи)

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

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

Ъглова ‹1,2 '!!'

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

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

Като цяло '!!' има най-добрата поддръжка, но '' (празен низ) се препоръчва и е предназначен за това.

person TheSharpieOne    schedule 05.09.2013
comment
Много благодаря. Търсих в мрежата повече от час и не можах да го намеря - person Scotty Bollinger; 06.09.2013
comment
Няма проблем. Той също така филтрира undefined. - person TheSharpieOne; 06.09.2013
comment
@TalasanNicholson, ако филтрира по null/undefined, тогава false би било добре. - person BrianS; 12.07.2014
comment
@TheSharpieOne това документирано ли е? - person BrianS; 12.07.2014
comment
Това изглежда не работи с квадратче за отметка value="!!" jsfiddle.net/2RBV9 - person Syl; 21.07.2014
comment
@sylouuu, null е запазена дума, не можете да кръстите модела си null. Освен това вашето поле за отметка беше извън обхвата на контролера. И накрая, ще трябва да използвате атрибута ngTrueValue, за да зададете стойността на модела с квадратче за отметка docs.angularjs.org/api/ng/input/input%5Bcheckbox%5D Ето фиксираната цигулка: jsfiddle.net/2RBV9/1 - person TheSharpieOne; 22.07.2014
comment
Thx @TheSharpieOne, трябваше да сложа ng-true-value="!" и ng-false-value="!!" - person Syl; 22.07.2014
comment
Този трик изглежда не работи в 1.4.0-rc1. Търсих бележка за промяна за нов синтаксис, но досега не намерих нищо. [връзка]jsfiddle.net/a50kdaL0 - person Rob; 08.05.2015
comment
ако list shortDescription е обект и връща null за някои детайли НАПРИМЕР detail[0].shortDescription:null и за някои detail[1].shortDescription: {id:1}, потребителят може да филтрира, за да получи не само null обекти,,, чрез филтър: {shortDescription: {} } ще покаже само обект detail[1].shortDescription. - person Ali Exalter; 18.01.2019

arrow_upward
6
arrow_downward

Мисля, че това е по-лесно за четене

 <ul>
    <li ng-repeat="detail in details" ng-if="detail.shortDescription">
        <p>{{detail.shortDescription}}</p>
    </li>
 </ul>
person Jens Alenius    schedule 11.02.2017
comment
има тонове решения за филтриране на нулеви стойности, това е това, което предпочитам - person alfredopacino; 04.06.2018
comment
Недостатък на това е, че ако имате хиляда записа, той все още отпечатва толкова етикети за коментари, колкото има записи, които нямат кратки описания. Опцията за филтриране предотвратява това. - person James Gray; 29.01.2020

arrow_upward
1
arrow_downward

Струва си да се отбележи, че за да използвате решението за празни кавички, трябва да оставите компаратора по подразбиране от false. Може би сте свикнали да поставяте true тук във филтрите на вашия контролер, като това:

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

Този тип стриктен филтър не би работил без окончателното true. Но трябва да премахнете true или да го направите false, за да работи ненулева проверка:

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