单个字段上的AngularJS过滤器

Question

我想使用AngularJS过滤用户状态有效或拒绝。 但是一个名字是peter reject的用户。 当我使用select tag方法显示状态为拒绝的用户时，隐藏状态为Active的用户。 不幸的是，它还显示了Peter Reject＆＃34;的信息，但他的状态是Active。

我的Html文件。

Status: 
<select class="select" ng-model="select1">
       <option value="Active">Active</option>     
        <option value="Reject">Reject</option>
 </select>

 <table>
      <th>Name</th>
      <th>Status</th>
    <tr ng-repeat="item in items | filter : select1>
      <td>{{item.name}}</td>
      <td>{{item.status}}</td>
    </tr>
</table>

我的json文件：

 [{"name":"joe jonas","status":"Active"},
{"name":"Peter Reject","status":"Active"},
{"name":"Marilyn Monroe","status":"Reject"}]

我只想显示状态为Reject列的用户，有什么想法？ 非常感谢你。

Answer 1

您正在将过滤器添加到所有列，而是将其添加到特定列中。

    <tr ng-repeat="item in items | filter : {status:select1}">
      <td>{{item.name}}</td>
      <td>{{item.status}}</td>
    </tr>

以上tr标记中也缺少结束逗号，我也添加了！

此外，您需要将select1变量初始化为空白字符串，以便最初显示所有字段。我正在使用ng-init来执行此操作。请参阅以下行。

<div ng-controller='MyController' ng-app="myApp" ng-init="select1 = ''">

＆＃13;

＆＃13;

var app = angular.module('myApp', []);

app.controller('MyController', function MyController($scope) {
  $scope.items = [{
    "name": "joe jonas",
    "status": "Active"
  }, {
    "name": "Peter Reject",
    "status": "Active"
  }, {
    "name": "Marilyn Monroe",
    "status": "Reject"
  }]
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-controller='MyController' ng-app="myApp" ng-init="select1 = ''">
  <select class="select" ng-model="select1">
    <option value="Active">Active</option>
    <option value="Reject">Reject</option>
  </select>

  <table>
    <th>Name</th>
    <th>Status</th>
    <tr ng-repeat="item in items | filter : {status:select1}">
      <td>{{item.name}}</td>
      <td>{{item.status}}</td>
    </tr>
  </table>
</div>

＆＃13;

＆＃13;

＆＃13;