如何在angularjs中等待直到响应来自$ http请求?
我正在使用来自多个页面中RESTful服务的一些数据。所以我为此使用了角度工厂。因此,我需要从服务器获取一次数据,并且每次我使用该定义的服务获取数据时。就像全局变量一样。这是示例:
var myApp = angular.module('myservices', []);myApp.factory('myService', function($http) {
$http({method:"GET", url:"/my/url"}).success(function(result){
return result;
});
});
在我的控制器中,我将此服务用作:
function myFunction($scope, myService) { $scope.data = myService;
console.log("data.name"+$scope.data.name);
}
根据我的要求,它对我来说很好。但是这里的问题是,当我重新加载网页时,该服务将再次被调用并请求服务器。如果在其他函数之间执行依赖于“已定义的服务”的函数,则会出现类似“某物”未定义的错误。因此,我想在脚本中等待直到服务加载。我怎样才能做到这一点?无论如何,在angularjs中这样做吗?
回答:
您应该在不知道何时完成的异步操作中使用Promise。承诺“表示尚未完成的操作,但有望在将来进行。”
(https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Promise)
一个示例实现如下:
myApp.factory('myService', function($http) { var getData = function() {
// Angular $http() and then() both return promises themselves
return $http({method:"GET", url:"/my/url"}).then(function(result){
// What we return here is the data that will be accessible
// to us after the promise resolves
return result.data;
});
};
return { getData: getData };
});
function myFunction($scope, myService) {
var myDataPromise = myService.getData();
myDataPromise.then(function(result) {
// this is only run after getData() resolves
$scope.data = result;
console.log("data.name"+$scope.data.name);
});
}
编辑:关于Sujoys的注释, 我需要做什么才能使myFuction()调用在.then()函数完成执行之前不会返回。
function myFunction($scope, myService) { var myDataPromise = myService.getData();
myDataPromise.then(function(result) {
$scope.data = result;
console.log("data.name"+$scope.data.name);
});
console.log("This will get printed before data.name inside then. And I don't want that.");
}
好吧,让我们假设对getData()的调用花费了10秒来完成。如果该函数在那时没有返回任何内容,它将有效地变为普通的同步代码,并会挂起浏览器直到完成。
尽管Promise会立即返回,但同时浏览器可以自由继续其他代码。一旦承诺解决/失败,就会触发then()调用。因此,即使它可能使您的代码流变得更复杂,这种方式也更加有意义(毕竟,复杂性通常是异步/并行编程的普遍问题!)
以上是 如何在angularjs中等待直到响应来自$ http请求? 的全部内容, 来源链接: utcz.com/qa/413869.html