如何在成功处理程序之外使用$ http Promise响应

Question

$scope.tempObject = {}; $http({   method: 'GET',   url: '/myRestUrl'}).then(function successCallback(response) {   $scope.tempObject = response   console.log("Temp Object in successCallback ", $scope.tempObject);}, function errorCallback(response) {});console.log("Temp Object outside $http ", $scope.tempObject);我得到了回应，successCallback但没有得到$scope.tempObject外界的支持$http。其显示undefined。如何访问response或$scope.tempObject之后$http

Answer 1

但是，如果我想在回调后使用$ scope.tempObject，那么该如何使用它。？

您需要链从httpPromise。保存httpPromise并将值返回到onFullfilled处理函数。

//save httpPromise for chaining

var httpPromise = $http({

   method: 'GET',

   url: '/myRestUrl'

}).then(function onFulfilledHandler(response) {

   $scope.tempObject = response

   console.log("Temp Object in successCallback ", $scope.tempObject);

   //return object for chaining

   return $scope.tempObject;

});

然后你外面连锁从httpPromise。

httpPromise.then (function (tempObject) {

    console.log("Temp Object outside $http ", tempObject);

});

有关更多信息，请参见《AngularJS $ q服务API参考-链接承诺》。

可以创建任何长度的链，并且由于一个承诺可以用另一个承诺来解决（这将进一步推迟其解决方案），因此可以在链中的任何点暂停/推迟对承诺的解决。这样就可以实现功能强大的API。1

基于承诺的异步操作的解释

console.log("Part1");

console.log("Part2");

var promise = $http.get(url);

promise.then(function successHandler(response){

    console.log("Part3");

});

console.log("Part4");

PIC

“ Part4”的控制台日志不必等待数据从服务器返回。XHR 启动后立即执行。“ Part3”的控制台日志在成功处理程序函数内部，该函数由$ q服务保留，并在从服务器到达数据并且XHR 完成后调用。

但是，如果我想在回调后使用$ scope.tempObject，那么该如何使用它。？

您需要链从httpPromise。保存httpPromise并将值返回到onFullfilled处理函数。

//save httpPromise for chaining

var httpPromise = $http({

   method: 'GET',

   url: '/myRestUrl'

}).then(function onFulfilledHandler(response) {

   $scope.tempObject = response

   console.log("Temp Object in successCallback ", $scope.tempObject);

   //return object for chaining

   return $scope.tempObject;

});

然后你外面连锁从httpPromise。

httpPromise.then (function (tempObject) {

    console.log("Temp Object outside $http ", tempObject);

});

有关更多信息，请参见《AngularJS $ q服务API参考-链接承诺》。

可以创建任何长度的链，并且由于一个承诺可以用另一个承诺来解决（这将进一步推迟其解决方案），因此可以在链中的任何点暂停/推迟对承诺的解决。这样就可以实现功能强大的API。1

基于承诺的异步操作的解释

console.log("Part1");

console.log("Part2");

var promise = $http.get(url);

promise.then(function successHandler(response){

    console.log("Part3");

});

console.log("Part4");

PIC

“ Part4”的控制台日志不必等待数据从服务器返回。XHR 启动后立即执行。“ Part3”的控制台日志在成功处理程序函数内部，该函数由$ q服务保留，并在从服务器到达数据并且XHR 完成后调用。

console.log("Part 1");

console.log("Part 2");

var promise = new Promise(r=>r());

promise.then(function() {

    console.log("Part 3");

});

console.log("Part *4*");

Answer 2

$ http调用是异步调用。回调函数在返回响应后执行。同时，该函数的其余部分继续执行，并将$ scope.tempObject记录为{}。解析$ http时，仅设置$ scope.tempObject。Angular将使用两种方式自动绑定更改的值。

视图中的{{tempObject}}会自动更新。

如果要在回调后使用tempObject，请执行此操作

then(function(data){

   onSuccess(data);

},function(){

});

function onSuccess(data){

// do something

}

Answer 3

这意味着如果我们$timeout延迟使用函数，那么它也会获取完整的数据。例如$timeout(function () { console.log("Temp Object outside $http ", $scope.tempObject); }, 1000)