javascript - AngularJS ng-repeat 和 json 数据的问题

标签 javascript json angularjs

作为 AngularJS 的新手,似乎某些事情应该很简单,但我寻求支持以使用 ng-repeat 检索 json 数据的正确方法。我已经搜索了其他帖子,但仍然无法解决问题。我在这里做错了什么?

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数据:

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

最佳答案

您的代码需要进行一些更改,但您已经差不多完成了:

$scope.programs = data.programs;

和(标题的单一程序

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

这里的工作引用版本:
http://plnkr.co/edit/JwmmA5?p=preview

关于javascript - AngularJS ng-repeat 和 json 数据的问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24436322/

相关文章:

json - Play Framework : How to replace all the occurrence of a value in a JSON tree

c# - 如何使 JSON.NET StringEnumConverter 使用连字符分隔的大小写

angularjs - 只运行一次的过滤器?

javascript - Angularjs ng-repeat 在另一个 ng-repeat 中

c# - C# MVC4.0 中的有效 Math.Random

javascript - Canvas 未绘制 html5(javascript,闭包)

javascript - 使用 servlet 和 ajax 从数据库填充文本框中的值

C# - 将 HTML 无序列表转换为 JSON 数组

javascript - AngularJS:服务器端记录客户端错误

javascript - Mongoose 保存是异步的吗?