如何知道一组异步函数是否已完成执行？

我的新闻网站提供3种类型的内容：文章，视频和推文。我基于接收到的参数加载这些内容类型的一个或全部。所以：如何知道一组异步函数是否已完成执行？

switch(param){ 
    case 'articles': loadArticles(); break; 
    case 'videos': loadVideos(); break; 
    case 'tweets': loadTweets(); break; 
    default: loadArticles(); loadVideos(); loadTweets(); break; 
}

我使用NProgress给用户进步的错觉。如何在loadArticles（），loadVideos（）和loadTweets（）中设置进度值以模拟进度？

编辑：这些功能中的每一个都有其各自的工厂调用（每个都有自己的$http.get()）。例如：articleFactory.getArticles().then(function(data){$scope.articles = data;})

来源

2015-04-16 Kabir Roy

要检查，如果所有的人都这样做，你可以使用['$ q.all（）']（https：//开头docs.angularjs.org/api/ng/service/$q）。 – ryanyuyu

并检查他们的进展延期'通知'来帮助。 – estus

如何将进度参考作为参数传递给这些函数，以便它们可以更新它？

case 'articles': loadArticles(progress); break; 

function loadArticles(progress) { 
    ... 
    progress.add(0.15); //Or whatever you do to increment 
}

这是您的替代方案吗？

来源

2015-04-16 19:27:53

我想到了这个。但是我需要在某处调用NProgress.done（）。 –

switch(param){ 
    case 'articles':NProgress.start(); loadArticles(); NProgress.done() ; break; 
    case 'videos': NProgress.start(); loadVideos(); NProgress.done() ; break; 
    case 'tweets':NProgress.start(); loadTweets(); NProgress.done() ; break; 
    default: NProgress.start(); loadArticles(); loadVideos(); loadTweets(); NProgress.done() ;break; 
}

你必须使用NProgress.set（someValue中）内loadArticles（）loadVideos（）和loadTweets（）每个来电者进入，你可以推迟承诺

来源

2015-04-16 19:29:35

您可能认为在加载函数中没有异步调用。我的错;编辑了这个问题。 –

打开，然后使用$q.all()等待为他们做的一切。这是一个非常简单的例子，你必须稍微修改你的代码。

angular.module('app', []).controller('testCtrl', ['$scope', '$timeout', '$q', 
 
    function($scope, $timeout, $q) { 
 
    var thenFn = function(value) { 
 
     console.log('resolved ', value); 
 
     return value; 
 
     }, 
 
     q1 = $scope.q1 = $q.defer(), 
 
     q2 = $scope.q2 = $q.defer(), 
 
     p1 = $scope.q1.promise, 
 
     p2 = $scope.q2.promise; 
 

 
    //NProgress.start(); 
 
    $scope.testValue = $q.all([ 
 
     p1.then(thenFn), 
 
     p2.then(thenFn) 
 
     ]) 
 
     .then(function(values) { 
 
     console.log('all promises resolved', values); 
 
     //NProgress.complete(); 
 
     }); 
 

 
    $timeout(function() { 
 
     console.log('resolving delayed promise 1'); 
 
     q1.resolve(1);  
 
    }, 1000); 
 
    
 
    $timeout(function() { 
 
     console.log('resolving delayed promise 2'); 
 
     q2.resolve(2); 
 
    }, 2000); 
 
}]);

<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script> 
 
    <meta charset="utf-8"> 
 
    <title>JS Bin</title> 
 
</head> 
 

 
<body ng-controller="testCtrl"> 
 
</body> 
 

 
</html>

编辑带上你的开发工具来查看结果当您运行的代码片段。

其次编辑此外，还有NProgress，ngProgress的角度版本，source

来源

2015-04-16 20:54:37

如何知道一组异步函数是否已完成执行？

回答

相关问题