angualrjs在service中get请求能得到数据，但是却无法返回到控制器当中使用。
服务端json数据
var data=
[
{Name:'name1'},
{Name:'name2'},
{Name:'name3'}
]
客户端
service.js
app.factory('Items', function($http) {
var list=
[
{Name: 'name4'},
{Name: 'name5'},
];
$http.get("http://localhost:3000/test").success(function(data) {
list=data;//get到的数据赋给list
console.log(list[0].Name);
});
alert('success');
return {
query:function()
{return list;},
}
});ctrl.js
app.controller('ctrl', function($scope,Items) {
$scope.names=Items.query();
});
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="ctrl">
<ul>
<li ng-repeat="x in names">
{{ x.Name }}
</li>
</ul>
</div>
</div>
<script src="app.js"></script>
<script src="service.js"></script>
<script src="ctrl.js"></script>
</body>
</html>
结果:
可以看到，console.log打印出了从服务端get到的数据。我在想可能是http.get是异步函数，于是加了一个alert阻塞，但factory返回的还是原来的旧数据。请问大家如何解决呢？
你需要$q 这个解决。。因为。。你在异步结果返回之前。。已经将return 返回了。。当然controller取不到数据了。。。
service
this.getMaterial=function(material,page){
var defer=$q.defer();
$http.get("http://localhost:3000/test").success(function(data) {
if(error==null){
defer.resolve(data);
}else{
defer.reject(error.message);
}
});
};
return defer.promise;controller
xxService.getMaterial($scope.material,$scope.page).then(function(data){
$scope.materialList=data.materialList;
$scope.page=data.page;
});应该返回函数,而不是返回数据
app.factory('Items', function($http) {
var list=
[
{Name: 'name4'},
{Name: 'name5'},
];
return {
query: function() {
return $http.get('http://localhost:3000/test.json');
}
};
});
app.controller('ctrl', function($scope,Items) {
Items.query().then(function(d) {
$scope.names = d.data;
});
获取数据是异步的，当进入页面时数据还没回来，所以显示的还是旧数据，
用$q的正解
确实是异步的问题。
不过想用alert的方法来阻塞……我感觉是不行的……感觉总有点怪怪的……明天起床再验证下……
用楼上的方法，将请求放到返回的对象里，应该是可行的。
还有一个方法你可以试下，不要直接list=data ，这样重写了list,引用也没了。可以试试用数组的push,pop方法导入数据，或者直接list[0]=...这样，应该就能保留引用以更新数据了 。