使用复选框过滤数据

时间:2016-12-22 14:14:16

标签: angularjs angularjs-ng-repeat

默认情况下必须显示支持“state:'notarchived'”和“state:'archived'”的项目必须隐藏 当我有一个支票时,我需要用“state:'notarchived'”隐藏元素,并显示带有“state:'archived'”的元素

有我的HTML

<th><input ng-model="archived.state"  type="checkbox"
      ng-true-value="'archived'" ng-false-value="undefined">Show archived</th>


<tr  ng-repeat="paymentinfo in paymentList | filter:keyword | filter:money | filter:getdate | filter:{state: 'notarchived'}: archived.state ? true : true">
          <td>{{paymentinfo.date}}</td>
          <td ng-click="singlepage(paymentinfo.id)" ><a>{{paymentinfo.name}}</a> </td></tr>

JS

 $scope.datas = [
            {date:'06-12-2016', name : 'Pinao Class', state: 'archived', remark : 'remarled', amount : 101, id : 21},
            {date:'15-04-2016', name : 'drivers Class', state: 'notarchived', remark : 'remarled', amount : 102, id : 22},
            {date:'24-03-2016', name : 'Airplane Class', state: 'archived', remark : 'remarled', amount : 103, id : 23}

    ];

$scope.paymentList = $scope.datas;

现在显示所有元素 如何更改过滤器才能正常工作?

2 个答案:

答案 0 :(得分:1)

试试这个:

设置复选框的初始值:

<input ng-model="archived.state"  type="checkbox"
      ng-true-value="'archived'" ng-false-value="'notarchived'" 
      ng-init="archived.state='notarchived'">Show archived</th>

并更改过滤器:

<tr ng-repeat="paymentinfo in paymentList | filter:keyword | filter:money | filter:getdate | filter:{state: archived.state}:true">

我尝试过它。

答案 1 :(得分:0)

这是未经测试的,因为我没有适当的环境设置

<th><input ng-model="archived.state" type="checkbox" ng-true-value="'archived'" ng-false-value="'notarchived'">Show archived</th>

filter:{state: archived.state ? 'archived' : 'notarchived'}

请测试并告诉我。 谢谢!