gpt4 book ai didi

javascript - AngularJS HTTP Get JSON 不会显示

转载 作者:行者123 更新时间:2023-11-30 10:03:34 25 4
gpt4 key购买 nike

我正在尝试学习 AngularJS,整个晚上都在为这个问题困惑。尝试从随机生成器加载 JSON 数据并使用服务将其显示在 View 中。 {{ main.title }} 有效,但 ng-repeat="user in main.users"和 {{ user.name }} 不显示任何内容。我哪里出错了?

索引.html

<html>
<head lang="en">
<meta charset="UTF-8">
<title>AngularJS Tutorial</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js"></script>
<script src="app.js"></script>
<script src="main.ctrl.js"></script>
<script src="users.serv.js"></script>
</head>
<body ng-app="app" ng-controller="MainController as main">
<div class = "container">
<h1>{{ main.title }}</h1>
<div ng-repeat="user in main.users">
<h2>{{ user.name }}</h2>
</div>
</div>
</body>
</html>

应用程序.js

angular.module('app', []);

main.ctrl.js

angular.module('app').controller('MainController', ['users', function(users) {
var vm = this;
users.get(function(data) {
vm.users = data;
});
vm.title = 'Hello World';
}]);

用户.serv.js

angular.module('app').factory('users', ['$http', function($http) {
return {
get: function (callback) {
$http.get('http://www.json-generator.com/api/json/get/bJHFVOzrzC?indent=2').success(function(data) {
return data;
})
}
}
}]);

最佳答案

ajax请求结束后需要回调

angular.module('app').factory('users', ['$http', function ($http) {
return {
get: function (callback) {
$http.get('http://www.json-generator.com/api/json/get/bJHFVOzrzC?indent=2').success(function (data) {
callback(data);
})
}
}
}]);

演示:Fiddle

关于javascript - AngularJS HTTP Get JSON 不会显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30450419/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com