我正在尝试从json文件中获取数据以进行一个小型测试项目。我在开发人员工具中没有收到任何错误,并且在请求后执行console.log(data)时,我从文件中获取数据。
这是我的角度代码:
var app = angular.module('myApp', []);
app.controller('MainController', ['$scope','$http', function($scope, $http){
$scope.todos = [];
$http.get('db/todos.json')
.then(function(data){
$scope.todos = data;
});
}]);
这是我的html文件:
<!doctype html>
<html ng-app="myApp">
<head>
<base href="/">
<title>My todo</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://code.angularjs.org/1.5.5/angular.js"></script>
<script src="/js/app.js"></script>
</head>
<body>
<div class="container" ng-controller="MainController">
<div class="row">
<h1>Your todos</h1>
<li ng-repeat="todo in todos">
{{ todo.name }}
<li>
</div>
</div>
</body>
</html>
在我的网站上,ng-repeat只是打印出六个项目符号点,这是错误的,因为我的json文件中只有两个条目。这也是我从console.log(data)得到的:
Object {data: Object, status: 200, config: Object, statusText: "OK"}
config: Object
data:Object
headers:(name)
status:200
statusText:"OK"
__proto__:Object
关于我可能错过的任何想法?
使用时.then
的实际响应数据位于中response.data
,因此,如果您按如下所示进行更改,则代码可以正常工作:
.then(function(response){
$scope.todos = response.data;
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句