Question

我有一个看起来像这样的数据设置

$scope.friends = [
    {
      name: function() {
        return 'steve';
      },
      number: function() {
        return 555;
      }
    },
    {
      name: function() {
        return 'mary';
      },
      number: function() {
        return 555;
      }
    },
    {
      name: function() {
        return 'jo';
      },
      number: function() {
        return 888;
      }
    }
  ]

现在我想要的是根据文本输入过滤ng-repeat上的数据。为此，我尝试过这样的尝试：

<table id="searchTextResults">
  <tr><th>Name</th><th>Phone</th></tr>
  <tr ng-repeat="friend in friends | filter:search">
    <td>{{friend.name}}</td>
    <td>{{friend.number}}</td>
  </tr>
</table>

输入定义为<input type="text" ng-model="search.name"/>。但过滤器不起作用。我已经尝试过来看看我是否修改了这样的数据结构

$scope.friends = [
{
  name:'steve',
  number: 555          
},
{
  name:'marry',
  number: 555
},
{
 name:'steve',
  number: 888
} 

 ]

然后才有效。但是我想保持我的数据结构不变。

任何人都可以请求帮助我如何过滤具有上述数据结构。

plnkr example。

Answer 1

您可以修改friends数据以达到此要求。我所做的是使用angular.forEach()函数修改数据并将其放入名为$scope.modifiedFriends的新数组中。

$scope.modifiedFriends = [];
angular.forEach($scope.friends, function(friend) {
    $scope.modifiedFriends.push({
        name: friend.name(),
        number: friend.number()
    });
});

而不是friends上的ng-repeat，重复modifiedFriends。

<tr ng-repeat="friend in modifiedFriends | filter:search">
    <td>{{friend.name}}</td>
    <td>{{friend.number}}</td>
</tr>

Working Plunker

ng -s中的ng-repeat过滤数据不起作用

1 个答案: