通过多个条件过滤 ng-repeat，其中一个是严格的

Question

我有一个搜索视图，正在尝试按多个条件对其进行过滤。第一种是按 EmployeeName、SupervisorEmployeeName 和 DepartmentName 作为一个组进行过滤，然后按具有两个值的状态下拉列表进行过滤：Active 和 Inactive。对于状态下拉列表，我想使用严格的过滤，因为即使我 select "Active"，它也会 return Inactive 因为 Inactive 包含 "active"

<select data-ng-model="employeeFilter.EmployeeStatusName" class="form-control">
    <option selected="selected" value="Active">Active</option>
    <option value="Inactive">Inactive</option>
</select>

<input type="text" data-ng-model="employeeFilter.$" class="form-control" placeholder="Filter search results" />

<tr data-ng-repeat="employeeEntity in employees | filter:employeeFilter | orderBy:sortType:sortReverse">
    <td><a href="#/employee-details/{{employeeEntity.EmployeeNumber}}">{{ employeeEntity.EmployeeNumber }}</a></td>
    <td>{{ employeeEntity.EmployeeName }}</td>
    <td>{{ employeeEntity.SupervisorEmployeeName }}</td>
    <td>{{ employeeEntity.DepartmentName }}</td>
    <td>{{ employeeEntity.EmployeeStatusName }}</td>
</tr>

是否可以直接对一列数据应用严格的标准？

谢谢。

Answer 1

我在这里从用户 maxisam 那里找到了我的解决方案：

Filtering by Multiple Specific Model Properties in AngularJS (in OR relationship)

在我的控制器中，我放置了以下内容：

$scope.filterEmployees = function (row) {
    var filterValue = $scope.searchFilter;
    var returnValue = true;
    if (filterValue !== undefined) {
        var supervisorName = row.SupervisorEmployeeName == null ? '' : row.SupervisorEmployeeName;
        var employeeName = row.EmployeeName == null ? '' : row.EmployeeName;
        var departmentName = row.DepartmentName == null ? '' : row.DepartmentName;
        returnValue =
        (
            angular.lowercase(employeeName).indexOf(angular.lowercase(filterValue)) !== -1 ||
            angular.lowercase(supervisorName).indexOf(angular.lowercase(filterValue)) !== -1 ||
            angular.lowercase(departmentName).indexOf(angular.lowercase(filterValue)) !== -1
        );
    }
    return returnValue;
};

在我的搜索视图中，我有这个：

<div class="col-sm-4">
    <div class="input-group" style="margin-bottom: 20px; width: 250px; float: left">
        <a href="#/employee-post/0" class="btn btn-success">New Employee</a>
        <select data-ng-model="statusFilter" class="form-control">
            <option selected="selected" value="Active">Active</option>
            <option value="Inactive">Inactive</option>
        </select>
    </div>
</div>
<div class="col-sm-4">
    Search results: {{employees.length == null ? '0' : (employees | filter:employeeFilter).length}} items
</div>
<div class="col-sm-4">
    <div class="input-group" style="margin-bottom: 20px; width: 250px; float: right">
        <span class="input-group-addon input-group-addon-default">Filter</span>
        <input type="text" data-ng-model="searchFilter" class="form-control" placeholder="Filter search results" />
    </div>
</div>

 <tr data-ng-repeat="employeeEntity in employees | filter:filterEmployees | filter: { 'EmployeeStatusName' : statusFilter }: true | orderBy:sortType:sortReverse">
    <td><a href="#/employee-details/{{employeeEntity.EmployeeNumber}}">{{ employeeEntity.EmployeeNumber }}</a></td>
    <td>{{ employeeEntity.EmployeeName }}</td>
    <td>{{ employeeEntity.SupervisorEmployeeName }}</td>
    <td>{{ employeeEntity.DepartmentName }}</td>
    <td>{{ employeeEntity.EmployeeStatusName }}</td>
</tr>

EmployeeStatusName 过滤器现在基于严格过滤，而其他所有内容都使用通配符进行评估。我想让它更通用，但至少它有效。

通过多个条件过滤 ng-repeat，其中一个是严格的

Filter an ng-repeat by multiple criteria with one being strict

filtering

angularjs