解决Angularjs异步操作后台请求用$q.all排列先后顺序问题


Posted in Javascript onNovember 29, 2019

最近我在做angularjs程序时遇到了一个问题

1.页面有很多选择框,一个选择框里面有众多的选择项,和一个默认选定的项,像下面这样(很多选择框,不只一个):

解决Angularjs异步操作后台请求用$q.all排列先后顺序问题

2.众多的选项要从后台接口得到,默认项从另一个后台接口得到,这就需要$promise.then()操作

3.而多个$promise.then()属于异步操作,先后顺序不是一定的,如果先得到众多选项,后得到默认值,显示就没有问题,如果顺序颠倒,默认项就会为空,这不是我想要的

4.这就需要众多选项的后台请求都获得完,才去后台请求默认值,

就用$q.all方法

let list = $q.all({    // 多个后台请求,部分先后顺序
 url1: getUrl1().$promise,
 url2: getUrl2().$promise,
 url3: getUrl3().$promise,
});
$scope.list.then(function (result) {
// 三个后台请求结果
 result.url1
 result.url2
 result.url3
}).finally(function () {  // finally的优点:1.无论成功失败都会执行 2.前面三个请求结束后才会执行
 // 最后一个后台请求

 // TODO
});

补充:当然还有then().then().then()......这种方法,就把请求顺序执行了,不过select众多选项的后台请求不需要先后顺序,只是默认项需要最后执行,我就选择$q.all这种方法了。

总结

以上所述是小编给大家介绍的解决Angularjs异步操作后台请求用$q.all排列先后顺序问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
jquery模拟按下回车实现代码
Sep 20 Javascript
js Form.elements[i]的使用实例
Nov 13 Javascript
jQuery 1.8 Release版本发布了
Aug 14 Javascript
JS实现上下左右对称的九九乘法表
Feb 22 Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 Javascript
用自定义图片代替原生checkbox实现全选,删除以及提交的方法
Oct 18 Javascript
JS简单实现点击按钮或文字显示遮罩层的方法
Apr 27 Javascript
深入探究angular2 UI组件之primeNG用法
Jul 26 Javascript
5 种JavaScript编码规范
Jan 30 Javascript
使用iView Upload 组件实现手动上传图片的示例代码
Oct 01 Javascript
axios实现简单文件上传功能
Sep 25 Javascript
Selenium执行Javascript脚本参数及返回值过程详解
Apr 01 Javascript
vue 组件开发原理与实现方法详解
Nov 29 #Javascript
vue ajax 拦截原理与实现方法示例
Nov 29 #Javascript
VUE 实现动态给对象增加属性,并触发视图更新操作示例
Nov 29 #Javascript
js中关于Blob对象的介绍与使用
Nov 29 #Javascript
js blob类型url的视频下载问题的解决
Nov 29 #Javascript
JavaScript之Blob对象类型的具体使用方法
Nov 29 #Javascript
VuePress 中如何增加用户登录功能
Nov 29 #Javascript
You might like
php smarty截取中文字符乱码问题?gb2312/utf-8
2011/11/07 PHP
php版微信自动获取收货地址api用法示例
2016/09/22 PHP
PHP多进程通信-消息队列使用
2019/03/08 PHP
传递参数的标准方法(jQuery.ajax)
2008/11/19 Javascript
JQuery SELECT单选模拟jQuery.select.js
2009/11/12 Javascript
js选取多个或单个元素的实现代码(用class)
2012/08/22 Javascript
getAsDataURL在Firefox7.0下无法预览本地图片的解决方法
2013/11/15 Javascript
Iframe 自动适应页面的高度示例代码
2014/02/26 Javascript
$(document).ready(function() {})不执行初始化脚本
2014/06/19 Javascript
jQuery中复合属性选择器用法实例
2014/12/31 Javascript
深入浅析JavaScript中的constructor
2016/04/19 Javascript
15位和18位身份证JS校验的简单实例
2016/07/18 Javascript
Angular.js实现动态加载组件详解
2017/05/28 Javascript
Angular通过angular-cli来搭建web前端项目的方法
2017/07/27 Javascript
JavaScript函数中的this四种绑定形式
2017/08/15 Javascript
NodeJs form-data格式传输文件的方法
2017/12/13 NodeJs
React Native基础入门之初步使用Flexbox布局
2018/07/02 Javascript
JS获取今天是本月第几周、本月共几周、本月有多少天、是今年的第几周、是今年的第几天的示例代码
2018/12/05 Javascript
微信小程序使用字体图标的方法
2019/05/23 Javascript
vue列表数据发生变化指令没有更新问题及解决方法
2020/01/16 Javascript
[02:39]DOTA2英雄基础教程 极限穿梭编织者
2013/12/05 DOTA
python下如何让web元素的生成更简单的分析
2008/07/17 Python
全面理解Python中self的用法
2016/06/04 Python
Python 包含汉字的文件读写之每行末尾加上特定字符
2016/12/12 Python
Django调用百度AI接口实现人脸注册登录代码实例
2020/04/23 Python
python实现数据结构中双向循环链表操作的示例
2020/10/09 Python
Numpy实现卷积神经网络(CNN)的示例
2020/10/09 Python
L’urv官网:精品女性运动服品牌
2019/07/07 全球购物
厨房管理计划书
2014/04/27 职场文书
会计专业应届生自荐信
2014/06/28 职场文书
与美同行演讲稿
2014/09/13 职场文书
公务员个人年终总结
2015/02/12 职场文书
2015年暑期社会实践活动总结
2015/03/27 职场文书
Python实现滑雪小游戏
2021/09/25 Python
CKAD认证中部署k8s并配置Calico插件
2022/03/31 Servers
Nginx速查手册及常见问题
2022/04/07 Servers