ng-repeat 搜索过滤器同时使用输入将数据添加到数据库

Question

我一直试图在我的代码中添加一个过滤器来过滤页面顶部的每个输入，但是，过滤器实际上是过滤每个属性。

例如：如果我在用户输入字段中搜索用户，过滤器实际上会过滤电话、角色和状态。如果文本输入在角色字段中，我只想过滤用户字段或角色的用户。

我也在使用相同的字段来添加用户，因此如果填写了输入并单击添加，则数据将添加到有效的数据库中，但我遇到了过滤器问题。我已经搜索并尝试了多种方法，但是，它似乎不起作用。如果有人能指出我正确的方向，我将不胜感激。

        <tr>
      <td><input class="form-control input-sm" ng-model="user.name" style="height:22px"></td>
      <td><input class="form-control input-sm" ng-model="user.phone" style="height:22px"></td>
      <td><input class="form-control input-sm" ng-model="user.role" style="height:22px"></td>
      <td><input class="form-control input-sm" ng-model="user.status" style="height:22px"></td>
      <td><button class="btn btn-primary btn-xs" ng-click="adduser(); showAlert($event)">Add</button></td>
      <td><button class="btn btn-info btn-xs" ng-click="update()">Update</button></td>
      <td><button class="btn btn-info btn-xs" ng-click="deselect()">Clear</button></td>
    </tr>

    <tr ng-repeat="user in userdb | filter:user.name | filter:user.phone | filter:user.role | filter:user.status">
      <td>{{user.name}}</td>
      <td>{{user.phone}}</td>
      <td>{{user.role}}</td>
      <td>{{user.status}}</td>
      <td><button class="btn btn-warning btn-xs" ng-click="edit(user._id)">Edit</button></td>
      <td><button class="btn btn-danger btn-xs" ng-click="remove(user._id)" disabled>Remove</button></td>
    </tr>

Answer 1

您可以尝试以下方法：

  <table>
  <tr>
  <td><input class="form-control input-sm" ng-model="user.name" style="height:22px"></td>
  <td><input class="form-control input-sm" ng-model="user.phone" style="height:22px"></td>
  <td><input class="form-control input-sm" ng-model="user.role" style="height:22px"></td>
  <td><input class="form-control input-sm" ng-model="user.status" style="height:22px"></td>
  <td><button class="btn btn-primary btn-xs" ng-click="adduser(); showAlert($event)">Add</button></td>
  <td><button class="btn btn-info btn-xs" ng-click="update()">Update</button></td>
  <td><button class="btn btn-info btn-xs" ng-click="deselect()">Clear</button></td>
</tr>

<tr ng-repeat="user in userdb | filter:{name: user.name, phone: user.phone, role: user.role, status: user.status}">
  <td>{{user.name}}</td>
  <td>{{user.phone}}</td>
  <td>{{user.role}}</td>
  <td>{{user.status}}</td>
  <td><button class="btn btn-warning btn-xs" ng-click="edit(user._id)">Edit</button></td>
  <td><button class="btn btn-danger btn-xs" ng-click="remove(user._id)" disabled>Remove</button></td>
</tr>
</table>