AngularJS ng-repeat和json数据的问题

Question

Being new to AngularJS it seems certain things should be simple but I reaching out for support on the correct way to retrieve json data using ng-repeat. 作为AngularJS的新手，似乎某些事情应该很简单，但我寻求使用ng-repeat检索json数据的正确方法的支持。 I've searched through other posts but still cannot solve the problem. 我搜索了其他帖子，但仍然无法解决问题。 What am I doing wrong here? 我在这里做错了什么？

html: HTML：

  <html lang="en" ng-app="configApp">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Configuration Admin</title>

</head>
<body>
<div ng-controller="OrganizationProgramCtrl">
    <ul>
        <li ng-repeat="program in programs">{{programs.title}}</li>
    </ul>
</div>

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.min.js"></script>
<script>
    var configApp = angular.module("configApp", []);
    function OrganizationProgramCtrl($scope, $http) {
        $scope.programs = [];
        $http.get('data/programs.json')
                .success(function (data, status, headers) {
                    console.log("Data Found");
                    $scope.programs = data;
                });
    }
</script>

</body>
</html>

json data: json数据：

{
    "programs": [{
        "title": "MA History"
    }, {
        "title": "MA  Biology"
    }, {
        "title": "MA Chemistry"
    }, {
        "title": "MA Classical Studies"
    }, {
        "title": "MA Liberal Arts"
    }]
}

Answer 1

You code needs a couple of changes but you're almost there: 您的代码需要进行一些更改，但是您几乎可以做到了：

$scope.programs = data.programs;

and (singular program for title 和（标题的单一程序

<li ng-repeat="program in programs">{{program.title}}</li>

Working reference version here: 这里的工作参考版本：
http://plnkr.co/edit/JwmmA5?p=preview http://plnkr.co/edit/JwmmA5?p=preview

Answer 2

In your ng-repeat you are assign the current iterator item to a variable called program however in your html to are referencing {{programs.title}} (programs with an 's') 在ng-repeat中，您将当前的迭代器项分配给一个名为program的变量，但是在html中引用了{{programs.title}} （带有's'的程序）

Change it to this and it should work {{program.title}} 更改为此，它应该可以工作{{program.title}}

AngularJS ng-repeat和json数据的问题

问题描述

2 个解决方案

解决方案1
1 2014-06-26 17:12:36

解决方案2
0 2014-06-26 17:10:43

AngularJS ng-repeat和json数据的问题

问题描述

2 个解决方案

解决方案1 1 2014-06-26 17:12:36

解决方案2 0 2014-06-26 17:10:43

解决方案1
1 2014-06-26 17:12:36

解决方案2
0 2014-06-26 17:10:43