Question

想要根据从多选下拉列表中选择的值在moduleName上创建过滤器。

DATA：

[
  {
    "_id": "59155aada593f4331499dd59",
    "uswin": "lovelje",
    "moduleName": "After Call Survey",
    "accessLevel": "Read Only",
    "reason": "A reason",
    "status": "PENDING",
    "date": 1493834611052,
    "notifierEmail": null,
    "__v": 0
  },
  {
    "_id": "59155ad3d07cc5af655b9d96",
    "uswin": "lovelje",
    "moduleName": "Activity ID",
    "accessLevel": "Admin",
    "reason": "Dev test",
    "status": "PENDING",
    "date": 1493651466675,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d97",
    "uswin": "lovelje",
    "moduleName": "Outbound",
    "accessLevel": "Read Only",
    "reason": "dd",
    "status": "PENDING",
    "date": 1493348356289,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d98",
    "uswin": "lovelje",
    "moduleName": "Vocab",
    "accessLevel": "Business Analyst",
    "reason": "dd",
    "status": "APPROVED",
    "date": 1493347986430,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d99",
    "uswin": "lovelje",
    "moduleName": "Vocab",
    "accessLevel": "Business User",
    "reason": "test",
    "status": "PENDING",
    "date": 1493244413636,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d9a",
    "uswin": "lovelje",
    "moduleName": "Outbound",
    "accessLevel": "IT User",
    "reason": "Test server email",
    "status": "PENDING",
    "date": 1492536070949,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d9b",
    "uswin": "lovelje",
    "moduleName": "ANI Block",
    "accessLevel": "Read Only",
    "reason": "Testing local email again, see if it's sending and recieving",
    "status": "PENDING",
    "date": 1492456119551,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d9c",
    "uswin": "lovelje",
    "moduleName": "After Call Survey",
    "accessLevel": "Admin",
    "reason": "Raisons",
    "status": "APPROVED",
    "date": 1491327537430,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d9d",
    "uswin": "lovelje",
    "moduleName": "IMT",
    "accessLevel": "Admin",
    "reason": "To see access",
    "status": "APPROVED",
    "date": 1490970158382,
    "notifierEmail": null,
    "$$hashKey": "object:97"
  },
  {
    "_id": "59155ad3d07cc5af655b9d9e",
    "uswin": "lovelje",
    "moduleName": "Outbound",
    "accessLevel": "Admin",
    "reason": "Testing my request access",
    "status": "PENDING",
    "date": 1490367409921,
    "notifierEmail": null
  },
  {
    "_id": "59155ad3d07cc5af655b9d9f",
    "uswin": "lovelje",
    "moduleName": "Vocab",
    "accessLevel": "Admin",
    "reason": "Because",
    "status": "APPROVED",
    "date": 1490216338219,
    "notifierEmail": null
  }
]

过滤数据：

[
  {
    "name": "After Call Survey",
    "show": false
  },
  {
    "name": "ANI Block",
    "show": false
  },
  {
    "name": "IMT",
    "show": false
  },
  {
    "name": "Messaging",
    "show": false
  },
  {
    "name": "Outbound",
    "show": false
  },
  {
    "name": "Vocab",
    "show": false
  }
]

JS

$scope.moduleFilter=function(entry){
        $scope.checkedModules = $filter('filter')($scope.modules, {show: 'true'})
$scope.checkedModules=($scope.checkedModules.length===0?$scope.modules:$scope.checkedModules);

        return $scope.checkedModules;
            };

HTML

<div  ng-repeat="request in (filteredItems = ((requests.value) | filter: { 'moduleName': moduleFilter } ))" class="col-xl-12 col-lg-12 col-md-12 col-sm-12 no-padding">

请建议。

Answer 1

谢谢你们。我找到了解决方案。我正在使用自定义过滤器。 byModuleName。

<div  ng-repeat="request in (filteredItems = ((requests.value) | byModuleName: modules ))" >

过滤器中传递的对象数据modules具有以下结构：

[
  {
    "name": "After Call Survey",
    "show": false
  },
  {
    "name": "ANI Block",
    "show": false
  },
  {
    "name": "IMT",
    "show": false
  },
  {
    "name": "Messaging",
    "show": false
  },
  {
    "name": "Outbound",
    "show": false
  },
  {
    "name": "Vocab",
    "show": false
  }
]

过滤：byModuleName

function byModuleName() {
  return function(requests, modules) {
    let checked = modules.filter(function filt(x){ 
        return x.show === true;
    });
    checked = (checked.length === 0 ? modules : checked);

    let filtered = [];
    requests.filter(function(items) {
      return checked.filter(function(filter) {
        if (items.moduleName === filter.name) {
          filtered.push(items);
        }
      })
    });
    return filtered;
  };
}

angular.module('vovApp')
  .filter("byModuleName", byModuleName);

使用MultiSelect下拉菜单的角度过滤器复选框

1 个答案: