使用函数过滤 ngTable

Filtering ngTable with a function

In this plunk 我有一个带 show-filter=true 的 ngTable。其中一列(Group Name)显示了一个字符串,该字符串是另一列(Group)的函数。问题是我无法按组名过滤,因为它是 "derived" 列。如何按群组名称筛选?

HTML:

    <table ng-table="tableParams" class="table table-bordered" show-filter="true">
        <tbody>
            <tr ng-repeat="u in $data">
                <td title="'User ID'" filter="{ uid: 'text' }">
                    {{ u.uid }}
                </td>
                <td title="'Name'"  filter="{ nm: 'text' }">
                  {{ u.nm }}
                </td>
                <td title="'Group ID'"  filter="{ ugr: 'text' }">
                   {{ u.ugr }}
                </td>
                <td title="'Group Name'"  filter="{ groupName(u.ugr): 'text' }">
                  {{ groupName(u.ugr) }}</td>
            </tr>
        </tbody>
    </table>

Javascript:

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

app.controller('myCtl', function($scope, NgTableParams) {

      $scope.data = [{
          uid: 'User 1',
          nm: 'Name 1',
          ugr: 1
      }, {
          uid: 'User 2',
          nm: 'Name 2',
          ugr: 2
      }, {
          uid: 'User 3',
          nm: 'Name 3',
          ugr: 2
      }];


      $scope.groupName = function(group){
          if (group==1)  
              return 'AAA';
          else
              return 'BBB';
      };


      $scope.tableParams = new NgTableParams({
          count: 5
      }, {
          data: $scope.data
      });

});

你可以直接在controller中进行分组,省去你的麻烦。

我已经使用 map 函数对设置组值进行了验证,然后将其显示为普通文本过滤器。

map函数如下

$scope.data = [{
          uid: 'User 1',
          nm: 'Name 1',
          ugr: 1
      }, {
          uid: 'User 2',
          nm: 'Name 2',
          ugr: 2
      }, {
          uid: 'User 3',
          nm: 'Name 3',
          ugr: 2
      }].map(function(x){x['group'] = x.ugr === 1 ? 'AAA' : 'BBB';return x;});

下面是相同的演示,如果对您有帮助,请告诉我。

Plunkr Demo