Question

HTML

<select class="form-control" id="selectrequest" ng-model="selected request" ng-change="vm.selected_requested()">
    <option value="pending" > Pending </option>
    <option value="approved"> Approved </option>
    <option value="rejected"> Rejected </option>
</select>

JS

vm.model=[{
    name:'abc',
    lastname:'xyz',
    status:pending
}]

//默认情况下需要选择待处理的项目 vm.selected_requested = function（）{

Answer 1

您好我已根据您的要求实施了此功能。现在，您可以从控制器中查看视图中的过滤示例。如果您需要任何进一步的帮助，请告诉我

  var mainApp = angular.module("mainApp", []); 
       mainApp.controller('studentController', function($scope,filterFilter) {
        var vm = $scope;
         $scope.model=[{ name:'abc_pending', lastname:'xyz', status:"pending" },
                     { name:'abc1_pending', lastname:'xyz', status:"pending" },
                     { name:'abc2_approved', lastname:'xyz', status:"approved" },
                     { name:'abc3_rejected', lastname:'xyz', status:"rejected" }];   
         
         vm.filteredArray = []; 
         vm.selected_requested = function (){
           vm.filteredArray = filterFilter($scope.model, {status:$scope.selected_request});
        
         }
          });

<html>
   
   <head>
      <title>Angular JS Controller</title>
      <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
   </head>
   
   <body>
      <h2>AngularJS Sample Application</h2>
      
      <div ng-app = "mainApp" ng-controller = "studentController">
        <select class="form-control" id="selectrequest" ng-model="selected_request" ng-change="selected_requested()">
                    <option value="" > All </option>
                    <option value="pending" > Pending </option>
                    <option value="approved"> Approved </option>
                    <option value="rejected"> Rejected </option>
                </select> 
        <div ng-repeat = "temp in model | filter:(!!selected_request || undefined) && {status: selected_request} ">
           <span ng-bind ="temp.name">
             </span>
           </div>
        <br/>
       Items in filtered Array <br/>
     <div ng-repeat = "temp in filteredArray">
           <span ng-bind ="temp.name">
             </span>
           </div>
      </div> 
      
   </body>
</html>

Answer 2

在selected_requested函数中使用角度过滤器根据所选选项过滤项目。否则，您可以使用$ filter创建自定义过滤器。请参阅文档https://docs.angularjs.org/api/ng/filter/filter

    angular.module('FilterInControllerModule', []).
        controller('FilterController', ['$scope','filterFilter', function($scope,filterFilter) {
          $scope.data=[]; //use your table data.
         vm.selected_requested = function (){


          $scope.filteredArray = filterFilter($scope.data, {status:selected request});

} 
        }]);

默认情况下如何选择挂起的表视图

2 个答案: