我正在努力接受承诺。所以我写了一个示例代码,如下所示
<!doctype html>
<html ng-app="myApp">
<head>
<meta charset="UTF-8">
<script src="../angularjs.js"></script>
</head>
<body>
<div ng-controller="CartController">
</div>
<script>
var app = angular.module('myApp', []);
app.controller('CartController', function($scope, $q,$http){
$scope.newFun = function()
{
var defered = $q.defer();
$http.get('data.json').success(function(data) {
console.log(data);
defered.resolve(data);
})
.error(function(data, status) {
console.error('Repos error', status, data);
});
return defered.promise;
}
var newdata = $scope.newFun().then(
function(data1)
{
//console.log(data1);
return data1;
});
console.log(newdata);
});
</script>
</body>
</html>
这里我试图返回从then函数获得的数据并将其分配给变量。但我得到一个$$状态对象,它有一个保存数据的值键。直接分配值是可能的还是在then函数里面我需要使用scope对象然后访问数据?
答案 0 :(得分:4)
您的代码存在许多问题。首先:您can't return from asynchronous operations,您需要使用回调。在你的情况下,因为你正在使用promises使用它的then
API。在其回调中,您可以将数据分配给变量。 Angular将执行其余的同步范围绑定(通过运行新的摘要)。
下一个问题:请勿使用$q.defer()
,您根本不需要它。这是最受欢迎的anti-pattern。
还有一件事:不要在控制器中发出任何http请求,这不适合它。而是将此逻辑移至可重用服务。
所有这些看起来都像这样:
var app = angular.module('myApp', []);
app.controller('CartController', function ($scope, data) {
data.get().then(function (data) {
var newdata = data;
});
});
app.factory('data', function($http) {
return {
get: function() {
return $http.get('data.json').then(function (response) {
return response.data;
}, function (err) {
throw {
message: 'Repos error',
status: err.status,
data: err.data
};
});
}
};
});