AngularJS:多个异步调用-如何

AngularJS: Multiple async calls - how to

本文关键字：调用 如何 异步 AngularJS      更新时间：2023-09-26

样本

请考虑一下这个Plunk。

背景

Plunk是我需要做的一个非常简单的样本。基本上，我需要得到一个包含验证结果的个人记录。该结果还将包括类信息，以便控制器可以分配适当的样式来指示强制状态(或不指示(。

问题

样本中最重要的函数是这个函数，self。Get将使用验证逻辑并产生一个结果。

self.Get('0f8fad5b-d9cb-469f-a165-70867728950e').then(function(result){
  $scope.person = result.person;
  $scope.validationResult = result.ValidateResult;
});

正如您所看到的(因为表单具有正确的值($scope.person被正确加载，但$scope.validationResult却不是。

问题

我怀疑连续异步调用存在时间问题，我如何修复这个Plunk，使一切正常工作？

我想，将异步调用嵌套在一起将是"一个"解决方案，但考虑到正在进行的调用的数量，这并不能解决所有问题，代码将变得非常不可读。

对于多个异步调用，我建议使用promise数组：

var promises = [];
promises.push(service1.get(...))
promises.push(service2.get(...))
promises.push(service3.get(...))
return $q.all(promises);

那么，如何将以下代码转换为使用链接，同时保持所有依赖项不变？：

self.Get = function (personId) {
    // 1. Init
    var defer = $q.defer();
    var asyncCallsResult = {};
    // 2. Get person
    var person = self.GetTestPerson();
    asyncCallsResult.person = person;
    self.LoadPersonDetailProxy(person).then(function(personDetailProxy) {
        $scope.personDetailProxy = personDetailProxy;
    });
    validationService.ValidateAsync($scope.personDetailProxy).then(function (validateResult) {
        asyncCallsResult.ValidateResult = validateResult;
    });
    defer.resolve(asyncCallsResult);
    return defer.promise;
}
相关文章：