Question

我正在尝试使用下拉列表进行过滤并在ng-repeat中动态更改值，不确定如何执行操作，是否有任何提示？

下拉菜单：

<label>Status</label>
<select class="form-control" ng-model="currentlySelected">
    <option value="">All</option>
    <option value="inactive">Inactive</option>
    <option value="active">Active</option>
</select>

过滤条件：

filter disable for All results
filter: {deleted_at : ''} --> Inactive results
filter: {deleted_at : null} --> Active results

查看：

<tr ng-repeat="user in users">

Answer 1

您需要像这样的东西

<li ng-repeat="user in users | filter : {status: currentlySelected}: true">

演示

angular.module('app', [])
.controller('Main', ['$scope', function($scope) {
  $scope.title = "Filter Based on Select Value";
   $scope.users = [
        {"id":18,"deleted_at" : ''},
        {"id":19,"deleted_at":'null'},
        {"id":21,"deleted_at":''},
        {"id":22,"deleted_at":''},
    ]
}]);

<!DOCTYPE html>
<html ng-app="app">

<head>
  <link rel="stylesheet" href="style.css" />
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
 
</head>

<body ng-controller="Main">
  <h1>{{title}}</h1>
  <label>Status</label>
   <select class="form-control" ng-model="currentlySelected">
      <option value="">All</option>
      <option value="null">Inactive</option>
      <option value="">Active</option>
   </select>

  <li ng-repeat="user in users | filter : {deleted_at: currentlySelected}: true">
    <h3>{{user.id}}</h3>
 </li>
</body>

</html>

AngularJS：通过ng-repeat进行动态过滤

1 个答案: