角度过滤器和 ng-click 不起作用答案

【问题标题】：Angular filter and ng-click not working角度过滤器和 ng-click 不起作用
【发布时间】：2016-05-13 10:01:37
【问题描述】：

我有一个列出一组列表的菜单：

<ul>
  <li ng-repeat="group in getData">
    <a ng-click="groupId = group.id">{{group.id}}</a>
  </li>
</ul>

单击该项目，应该会更新 groupId，但显然不是。

我还创建了一个从groupId 获取值的过滤器：

Data.query(function(data) {
  $scope.getData = data;
  $scope.currentGroup =  $filter('filter')(data, {id: $scope.groupId});
  $log.debug($scope.groupId);
  $log.debug($scope.currentGroup);
}, function(reason) {
  $log.error(reason)
});

这应该过滤以下列表以仅显示具有选定 groupId 的项目：

<tr ng-repeat="list in currentGroup.lists">
  <td>{{list.name}}</td>
</tr>

但是，它也不起作用。我可以在控制台中记录正确的数组，但表格没有显示任何数据。

请看一下这个Plunker。

【问题讨论】：

你需要调用一个方法而不是在ng-click中提供值
@PraveshKhatri 你能举一个例子吗？

标签： javascript angularjs filter ng-repeat angularjs-ng-click

【解决方案1】：

您的代码存在多个问题。这里有 2 个：

ng-repeat 创建它自己的子作用域，所以当你做ng-click="groupId = group.id" 时，你分配了子作用域的groupId，你应该设置父作用域：
```
<a ng-click="$parent.groupId = group.id">{{group.id}}</a>
```
但这看起来不太好；尝试使用as syntax，或从函数中分配它。
$filter 返回一个数组，因此您必须选择第一个元素才能正确分配您的currentGroup：
```
$scope.currentGroup =  $filter('filter')(data, {id: $scope.groupId})[0];
```

这是一个固定了这两个的 plunker：

http://plnkr.co/edit/f9ylUZ9mpInB00zzlYQd?p=preview

【讨论】：

以tks为例！你知道为什么点击链接时它没有更新表格吗？它不应该更新过滤器吗？
@drbishop，为什么要这样做？你的$filter 代码在一个只被调用一次的函数中。
我明白了。我尝试在函数外部调用它，但是它不起作用，因为$scope.getData 是undefined。有没有更好的方法来做到这一点？
@drbishop 一种方法是更改视图以从函数中获取列表，以便始终调用过滤器：例如：plnkr.co/edit/f9ylUZ9mpInB00zzlYQd?p=preview
谢谢，非常感谢您的帮助。

【解决方案2】：

在您的 Plunker 中，您可以像这样使用它

<table>
    <tr ng-repeat="group in currentGroup">
      <td ng-repeat="list in group.lists">{{list.name}}</td>
    </tr>
</table>

因为 currentGroup 也是一个数组

【讨论】：

我已经投票但我是新用户，只有在我获得 15 点声望后才会显示我的投票。