一尘不染

ngTable过滤嵌套字段

angularjs

我在ng-table中有一张发票清单,希望能够对嵌套属性进行过滤。json看起来像这样;

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

我的看法是这样的

<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>

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

更新资料

我找到了一种解决方法,将嵌套字段放入非嵌套的JSON元素中,在上面的示例中,我创建了一个JSON
[‘client_name’]元素并将其分配给rails模型中的client.fullname。然后,筛选器可以正常工作,因为它没有嵌套。

仍在寻找一种无需解决此问题的方法。


阅读 212

收藏
2020-07-04

共1个答案

一尘不染

您可以$filter在要从JSON响应中进行过滤的任何内容上使用。

**HERE**
是一个关于如何对嵌套JSON元素进行过滤的人为例子。示例代码取自ng-table的filter用法示例之一。

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

$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可以正常工作(如果我对您的要求正确的话)。如果那不是您的目标,请大声喊叫。:)

2020-07-04