嵌套字段上的 ngTable 过滤 [英] ngTable filtering on nested fields

问题描述

我在 ng-table 中有一个发票列表，希望能够过滤嵌套属性.json 看起来像这样；

<预><代码>[{编号:1，日期:20/03/2014"，否:1"，客户: {全名:ABC餐饮"}}]

我的观点是这样的

<tr class='listing' ng-repeat="invoice in $data"><td data-title="'发票编号'" sortable="'no'" filter="{'no':'text'}">{{发票号码}}</td><td data-title="'Date'" sortable="'date'" filter="{'date':'text'}">{{发票日期}}</td><td data-title="'Client'" sortable="'client.fullname'" filter="{'client.fullname':'text'}">{{invoice.client.fullname}}</td><td><a href="/api#/invoices/{{invoice.id}}">显示</a><a href="/api#/invoices/{{invoice.id}}/edit">编辑</a><a href="" ng-confirm-click="destroy(invoice.id)">删除</a></td></tr>

我想让过滤器为 client.fullname 工作.如何过滤嵌套属性?

更新

我找到了一种解决方法，我只是将嵌套字段放入非嵌套 JSON 元素中，在上面的示例中，我创建了一个 JSON['client_name'] 元素并将其分配给 rails 模型中的 client.fullname.然后过滤器工作，因为它没有嵌套.

仍在寻找一种方法，我可以在没有这项工作的情况下做到这一点.

解决方案

您可以使用 $filter 任何你想从 JSON 响应中过滤的内容.

HERE 是一个人为的例子过滤可以在嵌套的 JSON 元素上完成.示例代码取自ng-table 与过滤器一起使用的示例之一.

应用程序中需要注意的主要部分是

$scope.tableParams = new ngTableParams({页数:1，数:10，筛选: {'client': 'Bo'//样本过滤器}}, {总计:数据长度，获取数据:函数($延迟，参数){//注意内置角度过滤器的使用//这是在应用程序中注入的varorderedData =params.filter() ?$filter('filter')(data, params.filter()) :数据;$scope.users =orderedData.slice((params.page() - 1) * params.count(),params.page() * params.count());params.total(orderedData.length);$defer.resolve($scope.users);}});

Plunker 按预期工作(如果我的要求是正确的).如果那不是您的目标，请大声疾呼.:)

I've got a list of invoices in ng-table and would like to be able to filter on a nested attribute. The json looks like this;

[
  {
     id: 1,
     date: "20/03/2014",
     no: "1",
     client: {
       fullname: "ABC Catering"
     }
  }
]

My view look like this

<table ng-table="tableParams" show-filter="true" class="table">
  <tr class='listing' ng-repeat="invoice in $data">
    <td data-title="'Invoice No.'" sortable="'no'" filter="{'no':'text'}">
      {{invoice.no}}
    </td>
    <td data-title="'Date'" sortable="'date'" filter="{'date':'text'}">
      {{invoice.date}}
    </td>
    <td data-title="'Client'" sortable="'client.fullname'" filter="{'client.fullname':'text'}">
      {{invoice.client.fullname}}
    </td>
    <td>
      <a href="/api#/invoices/{{invoice.id}}">Show</a>
      <a href="/api#/invoices/{{invoice.id}}/edit">Edit</a>
      <a href="" ng-confirm-click="destroy(invoice.id)">Delete</a>
    </td>
  </tr>
</table>

I would like to get the filtering working for client.fullname. How do I filter on nested attributes?

Update

I've found a work around where I just put the nested field into a non-nested JSON element, in the above example I create a JSON['client_name'] element and assign it to client.fullname within the rails model. Then the filter works as it's not nested.

Still looking for a way in which I could do without this work around.

解决方案

You can use $filter on anything you want to filter on from the JSON response.

HERE is a contrived example of how filtering can be done on nested JSON element. Sample code is taken from one of the example of ng-table's usage with filters.

Main part to note in the app is

$scope.tableParams = new ngTableParams({
    page: 1,
    count: 10,
    filter: {
      'client': 'Bo' //Sample filter
    }
  }, {
    total: data.length,
    getData: function($defer, params) {

      //Note the usage of built in angular filter
      //which is injected in the app

      var orderedData = 
                params.filter() ?
                     $filter('filter')(data, params.filter()) :
                        data;

      $scope.users = 
          orderedData.slice((params.page() - 1) * params.count(), 
                             params.page() * params.count());

      params.total(orderedData.length);
      $defer.resolve($scope.users);
    }
  });

Plunker works as expected (if I got your requirement correct). Give a shout if that something that is not what you are aiming at. :)

这篇关于嵌套字段上的 ngTable 过滤的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！