javascript - Angular.JS ng-repeat 与嵌套 json 数组

Question

我有一个使用 $resource 的 People 服务，我使用 People.query() 从 PeopleCtrl 调用该服务，以从 json api 获取用户列表。数据返回如下:

[
  {
    "usr_id" : "1"
    "first_name" : "lucky"
    "awesome" : "true"
  },
  {
    "usr_id" : "6"
    "first_name" : "Adolf"
    "awesome" : "false"
  }
]

在我的html中，我想使用ng-repeat，并过滤该数据。我的想法是我有一个用户列表，我想从输入字段中过滤它们。我可以让基本功能正常工作，但是只要我输入“k”，它就会显示所有结果，而不仅仅是那些带有字母“k”的结果。这就是我所拥有的:

  <div id="section-body" ng-controller="PeopleSearchCtrl">

    <input type="text" ng-model="search.first_name" placeholder="Search Your Name">

    <center>
      <table ng-show="(filteredData = (People | filter:search)) && search.first_name && search.first_name.length >= 1">
        <tr ng-repeat="per in filteredData" ng-click="search.first_name = per.first_name + ' ' + per.last_name">
          <td>{{per.per_id}}</td>
          <td>{{per.first_name + " " + per.last_name}}</td>
        </tr>
      </table>
    </center>
    <button class="btn btn-large btn-primary" type="button">Submit</button>

  </div>

但是当我尝试输入内容时，它会显示所有用户。输入第二个字母，不改变，输入第三个字母，只显示匹配的记录。删除字符，直到只剩下“k”，没有记录显示。所以我想知道我怎么做错了。 'People' 变量被分配给范围，并且是用户的结果数据数组。

Answer 1

这是它的工作原理。一旦你弄清楚了，就很容易了。

<input ng-model="query">

<table id="productList" ng-show="(products|filter:query).length">
  <tr ng-repeat="product in products|filter:{username:query}">
...