如何使角度空过滤器匹配未定义和空值？

Question

我在输入过滤器然后将其删除时发现了一个问题，集合一直被过滤，并且没有显示带有 undefined 或 null 过滤词中的值。

示例代码：

<div ng-app="App" ng-controller="AppController as app">
<p>
Filters
</p>
    Name: <input ng-model="listFilters.name" type="text"/>
    <br/>
    Short Description: <input ng-model="listFilters.shortDescription" type="text"/>

    <ul>
        <li ng-repeat="person in app.persons | filter:{name: listFilters.name, shortDescription: listFilters.shortDescription}">
            <p>{{person.name}}</p>
        </li>
    </ul>
</div>

角码：

angular.module('App', []);
angular.module('App').controller('AppController', AppController);
function AppController() {
        var ctrl = this;

    ctrl.persons = [
        {
            name: 'Bill',
            shortDescription: null
        }, 
        {
            name: 'Sally',
            shortDescription: 'A girl'
        },
        {
            name: 'Jhon',
        },
    ];
}

一个工作小提琴：https://jsfiddle.net/89pkcww2/

查看我正在谈论的问题的步骤：

1. 按名称过滤，列表被过滤。
2. 抹掉过滤器，看看列表是如何再次显示的（Bill、Sally、Jhon）。
3. 按描述过滤，列表被过滤。
4. 删除过滤器，仅显示集合的第二个值（Sally）未定义或空值的值不显示。它是按“空字符串”过滤的。

我猜这是 Angular 过滤器中的 默认 行为，但是......有没有办法改变它？我必须自己制作过滤器吗？

我想分别按这两个属性进行过滤，collection | filter: filter.var 不用于此目的。

这也与过滤以仅显示非空值不同，它更接近相反...

Answer 1

1. shortDescription: null , 这并不意味着 '' , null != '' ，所以当您从“简短描述”中删除文本时，它不会显示“Bill”项目。
   1. 在第三项上根本没有 shortDescription，因此ng-model="listFilters.shortDescription" 无法绑定到该属性。
   2. 只有“Sally”项可以正常工作，因为 ng-model 可以绑定到该属性。

Answer 2

将您的 li html 更新为如下内容：

<li ng-repeat="person in app.persons | filter:listFilters.name">

这是更新后的小提琴：https://jsfiddle.net/89pkcww2/1/