Question

我正在努力解决一个我认为可能涉及到我所在范围的问题。我使用$ http请求获取一些json数据。

var myApp = angular.module('myApp', []);
myApp.controller('PeopleController', function($scope, $http) {
var url = 'https://sweltering-fire-6061.firebaseio.com/people.json';
$http.get(url).success(function(data) {
    $scope.people = data;
});

数据在我的表格中显示正常：

<table>
    <tr ng-repeat="person in people | filter:query | orderBy:orderBy">
        <td>{{person.name}}</td>
        <td>{{person.born}}</td>
    </tr>
</table>
<p>
   <select ng-model="orderBy">
      <option value="name">Name</option>
      <option value="born">Birth</option>
   </select>
</p>
<p>Search:<input ng-model="query"/></p>

然而，由于我声明使用$ http请求检索数据，我的过滤器和orderBy不再起作用。这是因为我在较低的范围内设置$scope.people = data。如果是的话，我有什么办法可以解决这个问题吗？

我在Cloud9 IDE和Brackets中对此进行了测试。谢谢

Answer 1

您返回的数据不正确，即网址的输出：

https://sweltering-fire-6061.firebaseio.com/people.json 是：

{"0":{"born":1791,"name":"Charles Babbage"},"1":{"born":1955,"name":"Tim Berners-Lee"}

这意味着：object.0 = {“born”：1791，“name”：“Charles Babbage”} 您可能想要返回一个数组，因为它现在尝试过滤“born”或“name”，而这些属性在您的对象中更深一层！

如何使用ng-model输入从AngularJS $ http请求中过滤JSON数据

1 个答案: