Question

假设您有一个填充了以下对象的数组：

{id: Integer, name:'String'}

以下列数组为例：

   $scope.users = [{
            id: 1, name: 'Marc Edgelund main'
    }]

然后以下列方式显示这些对象：

然后你有以下html：

      <input type="text" ng-model="search.$"/>

  <table>
    <thead>
      <th>id</th>
      <th>Name</th>
    </thead>
    <tbody>
      <tr ng-repeat="user in users | filter:search">
        <td>
          {{user.id}}
        </td>
        <td>
          {{user.name}}
        </td>
      </tr>
    </tbody>
  </table>

现在说你搜索字符串：Marc Main结果将变为空。

这是因为angular会检查对象的值并将其与字符串匹配。但是在上面的示例中，系统的客户端可能不会使用＆＃34; middle＆＃34;名称作为搜索参数，这意味着搜索将不一致并使最终用户烦恼，因为他们无法找到他们正在寻找的内容。

我的问题是如何创建一个允许上述功能的智能搜索功能？

这是一个显示我的例子的小提琴：

Fiddle

Answer 1

我在这里找到了类似于你问题的内容：AngularJS filter for multiple strings。

我结合了surfbuds的答案来传递你要过滤的属性名称，并使用Matthew Berg的循环逻辑来获得一个有效的解决方案。完全赞同这两个人在他们的帖子中的重要解释。结合起来，它就变成了

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

app.filter('filterByObjectName', function () {
return function (input, searchText, propertyName) {
    var returnArray = [];
    var searchTextSplit = searchText.toLowerCase().split(' ');
    for (var x = 0; x < input.length; x++) {
        var count = 0;
        for (var y = 0; y < searchTextSplit.length; y++) {
            let propertyValue = input[x][propertyName];
            if (propertyValue.toLowerCase().indexOf(searchTextSplit[y]) !== -1) {
                count++;
            }
        }
        if (count == searchTextSplit.length) {
            returnArray.push(input[x]);
        }
    }
    return returnArray;
}
});

app.controller('mainController', ['$scope', function ($scope) {
$scope.search = 'Marc';
$scope.users = [
    {
        id: 1,
        name: 'Marc Edgelund main'
    }
];
}]);

你的html变成了：

<table>
 <thead>
  <th>id</th>
  <th>Name</th>
 </thead>
 <tbody>
 <tr ng-repeat="user in users | matchAccessLevel:search:'name'">
  <td>{{user.id}}</td>
  <td>{{user.name}}</td>
 </tr>
 </tbody>
</table>

通配符上的角度智能搜索

1 个答案: