angular 使用 ng-click + input 进行过滤

Question

如何从 ul 中获取带有 ng-click 的过滤器作为 ngtable 的第二个过滤器？

<ul class="artGroups">
  <li class="" ng-repeat="artGroup in artGroups">
    <a href="#" ng-click="">{{artGroup.artGroupName}}</a>
  </li>
</ul>

这是一个 plnkr：http://plnkr.co/edit/Amdx2BzEWQWVYmRAgTMw

Answer 1

您可以在选择artGroup的主控制器上设置一个函数以更改值：

$scope.selectedGroup = '';
$scope.setGroup = function(group) {
    $scope.selectedGroup = group;
}

并连接 ng-click 指令：

<a href="#" ng-click="setGroup(artGroup.artGroupId)">{{artGroup.artGroupName}}</a>

然后您可以在 tr 上设置另一个自定义过滤器，使用范围上的 selectedGroup 变量：

<tr ng-repeat="article in articles | filter:searchText | isArtGroup:selectedGroup">

然后创建自定义过滤器以根据文章是否属于 artGroupId:

来过滤文章

app.filter('isArtGroup', function(){
  return function(values, groupId) {
    if(!groupId) {
      // initially don't filter
      return values;
    }
    // filter when we have a selected groupId
    return values.filter(function(value){
      return value.artGroupId === groupId;
    })
  }
})

以下是 Plunker

中的所有协同工作

angular 使用 ng-click + input 进行过滤

angular filter with ng-click + input

filter

angularjs

angularjs-ng-repeat

angularjs-ng-click