angularjs promises 在显示消息之前等待 3 个服务完成

Question

我在 UI 上有一个包含 3 个选项的复选框，每个复选框选项都代表一个要完成的独立服务。但是，由于这些服务被可变地调用，我需要想出一种方法来等待所有选定的选项完成，直到显示消息。

基本上，最初的实现是这样的：

if (doA) {
   mysvc.doA();
}

if (doB) {
   mysvc.doB();
}

if (doC) {
   mysvc.doC();
}

window.alert('success');

然后我意识到我需要等待它们全部完成，所以我想到了这个：

if (doA) {
   mysvc.doA();
}

if (doB) {
   mysvc.doB();
}

if (doC) {
   mysvc.doC();
}

setTimeout(function () {
    window.alert('success');
}, 8000);

因为如果全部选中，操作通常最多需要 8 秒才能完成。但这显然并不理想。另外，我最终想在最后为每个单独的操作提供反馈。任何帮助或资源将不胜感激。

Answer 1

您能否为每个调用附加一个变量，然后仅在它们都为真时才显示成功？

var doaCheck = false;
var dobCheck = false;
var docCheck = false;

if (doA) {
   mysvc.doA();
   doaCheck = true;
}

if (doB) {
   mysvc.doB();
   dobCheck = true;
}

if (doC) {
   mysvc.doC();
   docCheck = true;
}

if (doaCheck && dobCheck && docCheck ) {
   window.alert('success');
   // code to reset
}

Answer 2

您可以使用 $q.all:

var promises = [];
if (doA) {
   promises.push(mysvc.doA);

}

if (doB) {
   promises.push(mysvc.doB);
}

if (doC) {
   promises.push(mysvc.doC);
}

$q.all(promises).then(function(d){
    window.alert('success');
})

Answer 3

最正确的方法是使用 angular 的 $q. Each function should return a promise, then you can take all 3 promises and use $q.all to combine them together and have a callback function that runs only once all 3 are done. Here's an example with $http promises, but you can do it for anything by creating your own promises using $q.defer() as done here: example using $q.defer()

的承诺

    q1 = $scope.q1 = $q.defer(),
    q2 = $scope.q2 = $q.defer(),
    p1 = $scope.q1.promise, 
    p2 = $scope.q2.promise;


    $scope.fromThen = $q.all([
                            p1.then(thenFn), 
                            p2.then(thenFn)
                        ])
                        .then(function(values) {        
                            console.log(values);
                            return values;
                        });

angularjs promises 在显示消息之前等待 3 个服务完成

angularjs promises waiting for 3 services to complete before showing message

javascript

angularjs