angularjs 处理多个异步请求方法汇总


Posted in Javascript onJanuary 06, 2015

在实际业务中经常需要等待几个请求完成后再进行下一步操作。但angularjs中$http不支持同步的请求。

解决方法一:

$http.get('url1').success(function (d1) {

        $http.get('url2').success(function (d2) {

            //处理逻辑

        });

    });

解决方法二:

then中的方法会按顺序执行。

var app = angular.module('app',[]);

app.controller('promiseControl',function($scope,$q,$http) {

    function getJson(url){

        var deferred = $q.defer();

        $http.get(url)

            .success(function(d){

                d = parseInt(d);

                console.log(d);

                deferred.resolve(d);

            });

        return deferred.promise;

    }
    getJson('json1.txt').then(function(){

        return getJson('json2.txt');

    }).then(function(){

        return getJson('json1.txt');

    }).then(function(){

        return getJson('json2.txt');

    }).then(function(d){

        console.log('end');

    });

});

解决方法三:

$q.all方法第一个参数可以是数组(对象)。在第一参数中内容都执行完后就会执行then中方法。第一个参数的方法的所有返回值会以数组(对象)的形式传入。

var app = angular.module('app',[]);

app.controller('promiseControl',function($scope,$q,$http) {

    $q.all({first: $http.get('json1.txt'),second: $http.get('json2.txt')}).then(function(arr){

        console.log(arr);

        angular.forEach(arr,function(d){

            console.log(d);

            console.log(d.data);

        })

    });

});

$q的详细使用方法网上的有很多教程。我也是刚接触。讲不好,不敢乱讲。上面的代码是我按我的理解写的,经过了测试没有问题。

Javascript 相关文章推荐
javascript背投广告代码的完善
Apr 08 Javascript
简单的前端js+ajax 购物车框架(入门篇)
Oct 29 Javascript
基于jQuery的360图片展示实现代码
Jun 14 Javascript
JavaScript实现的使用键盘控制人物走动实例
Aug 27 Javascript
JS onkeypress兼容性写法详解
Apr 27 Javascript
jQuery通过ajax请求php遍历json数组到table中的代码(推荐)
Jun 12 Javascript
vue.js实现条件渲染的实例代码
Jun 22 Javascript
JavaScript实现单例模式实例分享
Dec 22 Javascript
Angular中的ng-template及angular 使用ngTemplateOutlet 指令的方法
Aug 08 Javascript
Vue.js 事件修饰符的使用教程
Nov 01 Javascript
Vue v-for中的 input 或 select的值发生改变时触发事件操作
Aug 31 Javascript
原生js实现简单轮播图
Oct 26 Javascript
json实现前后台的相互传值详解
Jan 05 #Javascript
jQuery中eq()方法用法实例
Jan 05 #Javascript
一款基于jQuery的图片场景标注提示弹窗特效
Jan 05 #Javascript
jQuery中toggleClass()方法用法实例
Jan 05 #Javascript
jQuery中removeClass()方法用法实例
Jan 05 #Javascript
jQuery中addClass()方法用法实例
Jan 05 #Javascript
js Calender控件使用详解
Jan 05 #Javascript
You might like
php实现执行某一操作时弹出确认、取消对话框
2013/12/30 PHP
PHP中HTML标签过滤技巧
2014/01/07 PHP
PHP查询大量数据内存耗尽问题的解决方法
2016/10/28 PHP
用javascript实现画板的代码
2007/09/05 Javascript
javascript 简单抽屉效果的实现代码
2010/03/09 Javascript
Javascript笔记一 js以及json基础使用说明
2010/05/22 Javascript
原生js ActiveXObject获取execl里面的值
2013/11/01 Javascript
Bootstrap4一次重大更新 几乎涉及每行代码
2016/05/16 Javascript
详解JS中的柯里化(currying)
2017/08/17 Javascript
在Mac下彻底卸载node和npm的方法
2018/05/16 Javascript
vue解决使用webpack打包后keep-alive不生效的方法
2018/09/01 Javascript
通过Python爬虫代理IP快速增加博客阅读量
2016/12/14 Python
使用Python对Csv文件操作实例代码
2017/05/12 Python
python利用正则表达式排除集合中字符的功能示例
2017/10/10 Python
Python程序员面试题 你必须提前准备!
2018/01/16 Python
Numpy数组的保存与读取方法
2018/04/04 Python
windows下python安装pip图文教程
2018/05/25 Python
详解Python3注释知识点
2019/02/19 Python
Pandas之MultiIndex对象的示例详解
2019/06/25 Python
PyTorch中的Variable变量详解
2020/01/07 Python
python 使用递归回溯完美解决八皇后的问题
2020/02/26 Python
Python docutils文档编译过程方法解析
2020/06/23 Python
python中Django文件上传方法详解
2020/08/05 Python
Python 爬虫批量爬取网页图片保存到本地的实现代码
2020/12/24 Python
收集的7个CSS3代码生成工具
2010/04/17 HTML / CSS
HTML5 manifest离线缓存的示例代码
2018/08/08 HTML / CSS
英国建筑用品在线:Building Supplies Online(BSO)
2018/04/30 全球购物
马耳他航空公司官方网站:Air Malta
2019/05/15 全球购物
Lookfantastic澳大利亚官网:英国知名美妆购物网站
2021/01/07 全球购物
团委书记的竞聘演讲稿
2014/04/24 职场文书
大型公益活动策划方案
2014/08/20 职场文书
反四风对照检查材料思想汇报
2014/09/16 职场文书
关于运动会的广播稿
2014/09/22 职场文书
2014年政风行风工作总结
2014/11/22 职场文书
《普罗米修斯》教学反思
2016/02/22 职场文书
python实现对doc、txt、xls等文档的读写操作
2022/04/02 Python