Question

我有角度1.3，我有以下数组：

     data : [
        {
           id :2,
           name : "danny davids",
           age :9

        },
{
           id :3,
           name : "sanny gordon",
           age :9

        }
     ]

我希望过滤器执行以下操作：

当我开始写单词＆＃34; s＆＃34;时，我希望danny davids消失，现在默认行为是，它们都仍然显示（s在姓氏的末尾）丹尼）。

严格模式是我不想使用的东西，我想要的行为是：

如果输入中没有值，我想看所有，如果我开始写，我想通过firstName / lastName看到确切的一个。

是否有角度1.3的默认过滤器？

Answer 1

我建议您使用$filter自定义过滤功能进行重复播放。根据文档，$filter期望

function(value, index, array)：谓词函数可用于编写任意过滤器。为数组的每个元素调用该函数，其中元素，索引和整个数组本身作为参数。

只显示返回true的元素。因此，您所要做的就是编写该功能。

您的过滤器功能可能如下所示：

$scope.filterData = function (obj) {
  return anyNameStartsWith(obj.name, $scope.searchFilter);
};

function anyNameStartsWith (fullname, search) {

  //validate if name is null or not a string if needed
  if (search === '')
    return true;

  var delimeterRegex = /[ _-]+/;
  //split the fullname into individual names
  var names = fullname.split(delimeterRegex);

  //do any of the names in the array start with the search string
  return names.some(function(name) {
      return name.toLowerCase().indexOf(search.toLowerCase()) === 0;
  });
}

您的HTML可能如下所示：

<input type="text" ng-model="searchFilter" />
<div ng-repeat="obj in data | filter : filterData">
    Id: {{obj.id}}
    Name: {{obj.name}}
</div>

A demo via plnkr

Answer 2

您可以按任意字符过滤匹配项：

样品条件：

yourDataList.display.toLowerCase().indexOf(searchData) !== -1;

示例：

 function createFilterForAnycharacters(searchData) {
        var lowercaseQuery = query.toLowerCase();
        return function filterFn(yourDataList) {
            return (yourDataList.display.toLowerCase().indexOf(searchData) !== -1);
        };
    }

Answer 3

使用此自定义过滤器获取结果匹配起始字符

app.filter('startsWithLetter', function () {
    return function (items, letter) {
        var filtered = [];
        for (var i = 0; i < items.length; i++) {
            var item = items[i];
            if (item.substr(0,letter.length).toLowerCase() == letter.toLowerCase()) {
                filtered.push(item);
            }
        }
        return filtered;
    };
});

Answer 4

适用于您的场景，您可以创建自定义过滤器

下面是html代码

<div ng-app="app">
    <div ng-controller="PersonCtrl as person">
        <input type="text" ng-model="letter" placeholder="Enter a letter to filter">
        <ul>
           <li ng-repeat="a in person.data | startsWithLetter:letter"> 
                {{a.name}}
            </li> 
        </ul>
    </div>
</div>

js代码

var app = angular.module('app', []);

app.filter('startsWithLetter', function () {
    return function (items, letter) {
        var filtered = [];
        var letterMatch = new RegExp(letter, 'i');
        for (var i = 0; i < items.length; i++) {
            var item = items[i];
            if (letterMatch.test(item.name.substring(0, 1))) {
                filtered.push(item);
            }
        }
        return filtered;
    };
});

app.controller('PersonCtrl', function () {

    this.data = [
        {
           id :2,
           name : "danny davids",
           age :9

        },
        {    
           id :3,
           name : "sanny gordon",
           age :9

        }
     ]

});

Answer 5

需要创建自定义过滤器功能才能执行此操作。没有默认方法来匹配角度中的第一个字符。

https://docs.angularjs.org/guide/filter

角度过滤器按字符匹配？

5 个答案: