0
如何使用AngularJS链接多个过滤器。我的情况是我有3个下拉菜单我想用作过滤器来过滤表中的数据。我只是创建了一个plunk来展示我想实现的目标，这里是我的网址plunk如何将多个自定义过滤器与AngualrJS链接
过滤工作正常，但没有根据我选择的下拉列表进行正确的结果筛选。
HTML
<select ng-model="filterItem.Org">
<option value="">Filter on Org</option>
<option value="org1">org1</option>
<option value="org2">org2</option>
<option value="org3">org3</option>
</select>
<select ng-model="filterItem.Period">
<option value="">Filter on Period</option>
<option value="2017">2017</option>
<option value="2018">2018</option>
</select>
<select ng-model="filterItem.ActionPlan">
<option value="">Filter on ActionPlan</option>
<option value="Plan1">Plan1</option>
<option value="Plan2">Plan2</option>
<option value="Plan3">Plan3</option>
<option value="Plan4">Plan4</option>
</select><br><br>
<table id="actionPlans" >
<thead>
<tr>
<th></th>
<th>Title</th>
<th>Period</th>
<th>AssociatedPlan</th>
<th>Organization</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="actionPlan in actionPlans | filter:customFilter">
<td></td>
<td>{{actionPlan.Title}}</td>
<td>{{actionPlan.Period}}</td>
<td>{{actionPlan.ActionPlan}}</td>
<td>{{actionPlan.Org}}</td>
</tr>
</tbody>
</table>
的Javascript控制器：
var app = angular.module('drpFiltering', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'Dropdown filtering';
$scope.actionPlans = [
{
Org: 'org1',
Title: 'Gjennomføre julebord',
Period: '2017',
ActionPlan: 'Kommunedelplan Helse',
},
{
Org: 'org1',
Title: 'Gjennomføre medarbeiderundersøkelse',
Period: '2017',
ActionPlan: 'Handlingsprogram 2017-2020',
}
,
{
Org: 'org2',
Title: 'God økonomistyring',
Period: '2018',
ActionPlan: 'Detaljprogram Helse',
},
{
Org: 'org2',
Title: 'Kjøre medarbeiderundersøkelse',
Period: '2018',
ActionPlan: 'Kommunedelplan Helse',
}
,{
Org: 'org2',
Title: 'Gjennomføre medarbeiderundersøkelse ',
Period: '2017',
ActionPlan: 'Temaplan Helse',
}
, {
Org: 'org3',
Title: 'Korrupsjonsforebyggende opplæring',
Period: '2017',
ActionPlan: 'plan2',
},
{
Org: 'org3',
Title: 'opplæring',
Period: '2018',
ActionPlan: 'plan3',
},
{
Org: 'org1',
Title: 'opplæring',
Period: '2018',
ActionPlan: 'plan4',
}
];
$scope.customFilter = function (data) {
if ($scope.filterItem !== undefined) {
if ($scope.filterItem.Org === data.Org) {
return true;
}
if ($scope.filterItem.Period === data.Period) {
return true;
}
if ($scope.filterItem.ActionPlan === data.ActionPlan) {
return true;
}
else{
return false;
}
}
};
});
任何帮助，这将真的apprissiated。