当我使用$ .get从外部json文件中检索数据创建一个简单的AngularJS搜索控制器时,我想知道我的代码有什么问题。看起来我拥有所有正确的数据。 JSfiddle在这里:http://jsfiddle.net/jmccommas/MLzF7/
控制器:
var personApp = angular.module('personApp', []);
personApp.controller('PersonListCtrl', function ($scope, $http) {
$http.get('data/persons.json').success(function(data) {
$scope.persons = data;
});
});
HTML:
<div ng-controller="PersonListCtrl">
<div class="bar">
Search: <input ng-model="query">
</div>
<ul class="">
<li ng-repeat="person in persons | filter:query">
{{persons.name}}
</li>
</ul>
</div>
JSON:
[
{
"name": "John Doe"
},
{
"name": "Mike Doe"
},
{
"name": "Sam Doe"
},
{
"name": "Jerry Doe"
},
{
"name": "Paul Doe"
},
{
"name": "Peter Doe"
},
{
"name": "Fred Doe"
},
{
"name": "Ralph Doe"
},
{
"name": "Mike Doe"
},
{
"name": "John Doe"
}
答案 0 :(得分:4)
有三件小事出错了(至少在JS小提琴中) 1.您已将JS设置为加载DOM Ready。将其更改为无包装。 2.在ng-repeat中,你有persons.name。它应该是person.name。当你正在通过人时,你正在找人。 3.小提琴中的JSON不存在。所以在我自己的小提琴中,我现在已经硬编码了对象
http://jsfiddle.net/amitavroy/rCrGP/
将您的李改为以下
<li ng-repeat="person in persons | filter:query">{{person.name}}</li>