筛选器's的第二个参数不起作用

Filter's second parameter not working

本文关键字：第二个 参数 不起作用 筛选      更新时间：2024-07-04

我正在尝试理解AngularJS中的"filter"过滤器。从文档中了解到，它还需要第二个参数。如果传递为"true"，则执行严格的比较。

HTML

<fieldset>
    <legend>Array of objects (Search all properties)</legend>
    <input type="text" ng-model="searchObject" />
    <ul>
        <li ng-repeat="value in arrOfObjects | filter: searchObject: true">
            <span>{{value.firstName}}</span>
            <span> {{value.lastName}}</span>:
            <span><strong>{{value.email}}</strong></span>
        </li>
    </ul>
</fieldset>

JS

$scope.arrOfObjects = [
    {
        firstName: "Anup",
        lastName: "Vasudeva",
        email: "anup.vasudeva@email.com"
    },
    {
        firstName: "Vijay",
        lastName: "Kumar",
        email: "vijay.kumar@email.com"
    },
    {
        firstName: "Virat",
        lastName: "Kohli",
        email: "virat.kohli@yahoo.com"
    }
];

我所期望的是，如果我键入"aNuP"，它将尝试与所有属性完全匹配，并且将无法返回任何内容。因此，我应该看到一个空列表。

我是不是错过了什么。

这是一个显示以下解释的plunker：http://plnkr.co/edit/b1vuJV4RFNQSdpfaw0Pd?p=preview

对对象进行角度过滤的方法是比较对象的字段，看看它们是否包含过滤条件，同时忽略大小写。这提供了一个广泛的用法，可以通过添加第二个布尔参数true来缩小该用法的范围，以指示要删除contains规则。

在您的示例中：

<fieldset>
    <legend>Array of objects (Search all properties)</legend>
    <input type="text" ng-model="searchObject" />
    <ul>
        <li ng-repeat="value in arrOfObjects | filter: searchObject: true">
            <span>{{value.firstName}}</span><span> {{value.lastName}}</span>: <span><strong>{{value.email}}</strong></span>
        </li>
    </ul>
</fieldset>

键入Vasudeva、Anup或anup.vasudeva@email.com将各自过滤掉除第一条记录之外的所有记录，因为在单个字段上完全匹配。因此，任何字段上的精确匹配都将导致显示记录。

删除"true"：

<li ng-repeat="value in arrOfObjects | filter: searchObject">

给出一个更大的包含集，因为它在任何字段中查找表达式并忽略大小写，所以键入字母a（出现在一个或多个字段中的所有对象）会列出所有对象。

要在对象中的单个字段上进行筛选，请使用以下格式：

<li ng-repeat="value in arrOfObjects | filter: {lastName :searchObject}">

类似地，你可以添加第二个布尔参数来获得完全匹配：

<li ng-repeat="value in arrOfObjects | filter: {lastName :searchObject}:true">

最后，您可以通过在控制器中定义一个函数来创建自定义过滤器，该函数对给定的匹配返回true或false。

<li ng-repeat="value in arrOfObjects | filter: myEmailFilter">

并在您的控制器中写入实际的过滤器。

$scope.myEmailFilter = function(value) {
    console.log(value.email);
    if(value.email.indexOf("email.com")>=0) {
      console.log('true');
      return true;
    } else {
      console.log('false');
      return false;
    }
  };
相关文章：