ng-table:过滤列

时间:2016-03-31 12:12:57

标签: angularjs ngtable

我正在使用ng-table,我想过滤我的列。 它适用于简单的数据。

<table ng-table="tableParams"  show-filter="true" class="table table-striped table-bordered table-hover" id="dynamic-table">
    <tr ng-repeat="consultant in $data">
        <td  class="text-center" data-title="'Ville résidence'" filter="{ 'villeResidence': 'text' }">{{consultant.villeResidence}}</td>
        <td  class="text-center" data-title="'Contrat'" filter="{ 'typeContrat.contrat': 'text' }" >
            <span ng-repeat="typeContrat in consultant.typeContrats">
                <a class="form-control-static" ui-sref="type-contrat-detail({id: {{typeContrat.id}}})">{{typeContrat.contrat}}</a>{{$last ? '' : ', '}}
            <span>
        </td>
    </tr>
</table>

但是有一个更复杂的专栏(这里:&#34; contrat&#34;)我不知道该怎么做。 如果有人知道......

[UPDATE]

<td class="text-center" data-title="'Contrat'" filter="{ 'typeContrat.contrat': 'text' }" data-title-text="Contrat">
        <!-- ngRepeat: typeContrat in consultant.typeContrats -->
    <span ng-repeat="typeContrat in consultant.typeContrats" class="ng-binding ng-scope">
        <a class="form-control-static ng-binding" ui-sref="type-contrat-detail({id: 1})" href="#/type-contrat/1">CDI</a>, 
        <span>    
        </span>
    </span>
    <!-- end ngRepeat: typeContrat in consultant.typeContrats -->
    <span ng-repeat="typeContrat in consultant.typeContrats" class="ng-binding ng-scope">
            <a class="form-control-static ng-binding" ui-sref="type-contrat-detail({id: 2})" href="#/type-contrat/2">Freelance</a>, 
        <span></span>
    </span>
    <!-- end ngRepeat: typeContrat in consultant.typeContrats -->
    <span ng-repeat="typeContrat in consultant.typeContrats" class="ng-binding ng-scope">
            <a class="form-control-static ng-binding" ui-sref="type-contrat-detail({id: 3})" href="#/type-contrat/3">Portage</a>
        <span></span>
    </span><!-- end ngRepeat: typeContrat in consultant.typeContrats -->
</td>

1 个答案:

答案 0 :(得分:1)

正如前面提到的here和我在文档中看到的那样,我认为ng-table不适合嵌套模型。

解决方法可能是根据contats的数组数据创建属性,然后按其进行过滤。 因此,对于每个consultant,我添加了一个属性contracts,其中包含其typeContrats.contats的连接字符串:

_.forEach(consultantData, function(value) {
    var contrats = _.map(value.typeContrats, 'contrat');
    value.contrats = _.join(contrats, ', ');
});

然后在HTML中:

<td class="text-center" data-title="'Contrat'" filter="{ 'contrats': 'text' }">

以下是fiddle示例。

我希望这是你想要实现的目标。