2016-11-16 68 views
0

下面的代码应根据所选择的状态显示的用户列表中, JSP代码滤波器不表现为预期状态= “ACTIVE”

<table> 
    <thead> 
     <tr> 
     <th>Aggregate</th> 
     <th>User id</th> 
     <th>First Name</th> 
     <th>Last Name</th> 
     <th>Phone Number</th> 
     <th>Email</th> 
     <th class="text-center">Status</th> 
     </tr> 
    </thead> 

    <tbody > 

     <tr> 
      <td><input type="text" class="form-control" ng-model="search.agId" /></td> 
      <td><input type="text" class="form-control" ng-model="search.id" /></td> 
      <td><input type="text" class="form-control" ng-model="search.firstName" /></td> 
      <td><input type="text" class="form-control" ng-model="search.lastName" /></td> 
      <td><input type="text" class="form-control" ng-model="search.mobileNo" /></td> 
      <td><input type="text" class="form-control" ng-model="search.emailId" /></td> 
      <td> 
       <select class="form-control" ng-model="search.status"> 
        <option value=""> Select </option> 
        <option value="ACTIVE"> Active </option> 
        <option value="INACTIVE"> In Active </option> 
        <option value="B"> Blocked </option> 
       </select> 
      </td> 
     </tr> 


     <tr ng-repeat="userone in filtereddata = (users.data | filter:search)"> 
      <td>{{ userone.agId }}</td> 
      <td>{{ userone.id }}</td> 
      <td>{{ userone.firstName }}</td> 
      <td>{{ userone.lastName }}</td> 
      <td>{{ userone.mobileNo }}</td> 
      <td>{{ userone.emailId }}</td> 
      <td class="text-center" ng-switch on="userone.status"> 
       <span class="inac label label-success" ng-switch-when="ACTIVE">Active</span> 
       <span class="inac label label-danger" ng-switch-when="INACTIVE">In Active</span> 
       <span class="inac label label-danger" ng-switch-when="B">Blocked</span> 
      </td> 
     </tr> 

    </tbody> 
</table> 

控制器JS代码

$scope.$watch('search', function (newVal, oldVal) { 
      $scope.filtered = filterFilter($scope.users.data, newVal); 

      console.log($scope.filtered); 

      $scope.bigTotalItems = (typeof $scope.filtered == 'undefined') ? 0 : $scope.filtered.length; 
      $scope.noOfPages = Math.ceil($scope.bigTotalItems/$scope.entryLimit); 
      $scope.currentPage = 1; 
     }, true); 

它适用于INACTIVE和阻止(即B)用户选择 ACTIVE其显示

我在控制器JS代码 给出一个简单的​​的活动和非活动状态的所有用户来说,它实际上是在选择返回活动和非活动成员过滤后的数据里面活动。它适用于其他选择。

我应该如何解决这个问题?

让我知道是否需要任何额外的数据

+0

此问题被错误标记为'java'标记。我已经删除了这个标签。 – AlexR

回答

1

angular.module('test', []).controller('Test', Test); 
 

 
function Test($scope, $filter) { 
 
    $scope.data = [{ 
 
    name: 'apple', 
 
    status: 'inactive' 
 
    }, { 
 
    name: 'banana', 
 
    status: 'active' 
 
    }, { 
 
    name: 'grape', 
 
    status: 'deleted' 
 
    }, { 
 
    name: 'orange', 
 
    status: 'inactive' 
 
    }, { 
 
    name: 'pear', 
 
    status: 'deleted' 
 
    }, { 
 
    name: 'watermelon', 
 
    status: 'active' 
 
    }] 
 
    
 
    $scope.filter = function(actual, expected) { 
 
    if (expected == '') return true; 
 
    
 
    return angular.equals(actual, expected); 
 
    } 
 
    
 
    $scope.$watch('search', function(newVal) { 
 
    $scope.filtered = $filter('filter')($scope.data, newVal, $scope.filter); 
 
    }); 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
 
<div ng-app='test' ng-controller='Test'> 
 
    Search: 
 
    <select ng-model="search"> 
 
    <option value="">Select</option> 
 
    <option value="active">Active</option> 
 
    <option value="inactive">Inactive</option> 
 
    <option value="deleted">Deleted</option> 
 
    </select> 
 
    <hr> 
 
    <div ng-repeat="item in data | filter:search:filter"> 
 
    {{item.name}} - {{item.status}} 
 
    </div> 
 
    <hr> 
 
    <div ng-repeat="item in filtered"> 
 
    {{item.name}} - {{item.status}} 
 
    </div> 
 
</div>

通过阅读API reference,它看起来像你可以在第三个参数传递true执行严格的比较。

<tr ng-repeat="userone in filtereddata = (users.data | filter:search:true)">

如果您需要正确的结果在你的控制器,你需要在第三个参数传递也是如此。

$scope.filtered = filterFilter($scope.users.data, newVal, $scope.filter);

编辑:要选择空滤器时解决空的结果的问题,我们需要使用自定义过滤功能。更新的代码。

+0

即使经过上述变更,问题仍然存在 – abhi314

+0

@abhi314包含代码示例 – Icycool

+0

在上面的代码片段中选择任何状态,然后选择'选择'状态,然后显示完整列表,但它是空的。 – abhi314