angular $q服务的用法
Promise是一种和callback有类似功能却更强大的异步处理模式,有多种实现模式方式,比如著名的Q还有JQuery的Deffered。
什么是Promise
以前了解过Ajax的都能体会到回调的痛苦,同步的代码很容易调试,但是异步回调的代码,会让开发者陷入泥潭,无法跟踪,比如:
funA(arg1,arg2,function(){
funcB(arg1,arg2,function(){
funcC(arg1,arg2,function(){
xxxx....
})
})
})
本身嵌套就已经很不容易理解了,加上不知何时才触发回调,这就相当于雪上加霜了。
但是有了Promise这种规范,它能帮助开发者用同步的方式,编写异步的代码,比如在AngularJS中可以使用这种方式:
deferABC.resolve(xxx)
.then(funcSuccess(){},funcError(){},funcNotify(){});
当resolve内的对象成功执行,就会触发funcSuccess,如果失败就会触发funcError。有点类似
deferABC.resolve(function(){
Sunccess:funcSuccess,
error:funcError,
notify:funcNotify
})
再说的直白点,Promise就是一种对执行结果不确定的一种预先定义,如果成功,就xxxx;如果失败,就xxxx,就像事先给出了一些承诺。
比如,小白在上学时很懒,平时总让舍友带饭,并且事先跟他说好了,如果有韭菜鸡蛋就买这个菜,否则就买西红柿炒鸡蛋;无论买到买不到都要记得带包烟。
小白让舍友带饭()
.then(韭菜鸡蛋,西红柿炒鸡蛋)
.finally(带包烟)
$q服务
q服务是AngularJS中自己封装实现的一种Promise实现,相对与Kris Kwal's Q要轻量级的多。
先介绍一下$q常用的几个方法:
- defer() 创建一个deferred对象,这个对象可以执行几个常用的方法,比如resolve,reject,notify等
- all() 传入Promise的数组,批量执行,返回一个promise对象
- when() 传入一个不确定的参数,如果符合Promise标准,就返回一个promise对象。
在Promise中,定义了三种状态:等待状态,完成状态,拒绝状态。
关于状态有几个规定:
- 1 状态的变更是不可逆的
- 2 等待状态可以变成完成或者拒绝
defer()方法
在$q中,可以使用resolve方法,变成完成状态;使用reject方法,变成拒绝状态。
下面看看 $q的简单使用:
<html ng-app="myApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body>
<div ng-controller="myctrl">
{{test}}
</div>
<script type="text/javascript">
var myAppModule = angular.module("myApp",[]);
myAppModule.controller("myctrl",["$scope","$q",function($scope, $ q ){
$scope.test = 1;//这个只是用来测试angularjs是否正常的,没其他的作用 var defer1 = $q.defer();
var promise1 = defer1.promise; promise1
.then(function(value){
console.log("in promise1 ---- success");
console.log(value);
},function(value){
console.log("in promise1 ---- error");
console.log(value);
},function(value){
console.log("in promise1 ---- notify");
console.log(value);
})
.catch(function(e){
console.log("in promise1 ---- catch");
console.log(e);
})
.finally(function(value){
console.log('in promise1 ---- finally');
console.log(value);
}); defer1.resolve("hello");
// defer1.reject("sorry,reject");
}]);
</script>
</body>
</html>
其中defer()用于创建一个deferred对象,defer.promise用于返回一个promise对象,来定义then方法。then中有三个参数,分别是成功回调、失败回调、状态变更回调。
其中resolve中传入的变量或者函数返回结果,会当作第一个then方法的参数。then方法会返回一个promise对象,因此可以写成
xxxx
.then(a,b,c)
.then(a,b,c)
.then(a,b,c)
.catch()
.finally()
继续说说上面那段代码,then...catch...finally可以想想成java里面的try...catch...finally。
all()方法
这个all()方法,可以把多个primise的数组合并成一个。当所有的promise执行成功后,会执行后面的回调。回调中的参数,是每个promise执行的结果。
当批量的执行某些方法时,就可以使用这个方法。
var funcA = function(){
console.log("funcA");
return "hello,funA";
}
var funcB = function(){
console.log("funcB");
return "hello,funB";
}
$q.all([funcA(),funcB()])
.then(function(result){
console.log(result);
});
执行的结果:
funcA
funcB
Array [ "hello,funA", "hello,funB" ]
when()方法
when方法中可以传入一个参数,这个参数可能是一个值,可能是一个符合promise标准的外部对象。
var funcA = function(){
console.log("funcA");
return "hello,funA";
}
$q.when(funcA())
.then(function(result){
console.log(result);
});
当传入的参数不确定时,可以使用这个方法。
angular $q服务的用法的更多相关文章
- AngularJS 中的Promise --- $q服务详解
先说说什么是Promise,什么是$q吧.Promise是一种异步处理模式,有很多的实现方式,比如著名的Kris Kwal's Q还有JQuery的Deffered. 什么是Promise 以前了解过 ...
- Angular通信$q服务和promise对象
promise 约定(promise)是一个对象,表示在未来时间点会发生的某件事情,约定可以是三种状态之一:等待.完成或拒绝.约定将从等待状态开始,然后可以转换为完成或者拒绝状态,一旦约定完成或者被拒 ...
- angular中的$q服务实例
用于理解$q服务 参考:http://www.zouyesheng.com/angular.html#toc39 广义回调管理 和其它框架一样, ng 提供了广义的异步回调管理的机制. $http 服 ...
- Q的进阶用法
Q的实例化用法 #q1 里面的条件都是or的关系 q1=Q() q1.connector = 'OR' q1.children.append(('id',1)) q1.children.append( ...
- $q服务——angular
$q是做为angular的一个服务而存在的,只是对promise异步编程模式的一个简化实现版,源码中剔除注释实现代码也就二百多行,下面开始介绍$q的API. 一.defer对象(延迟对象)可以通$q. ...
- $q服务的API详解
下面我们通过讲解$q的API让你更多的了解promise异步编程模式.$q是做为angularjs的一个服务而存在的,只是对promise异步编程模式的一个简化实现版,源码中剔除注释实现代码也就二百多 ...
- $q服务的使用
1. 创建一个Service,去服务器读取数据: // $q 是内置服务,所以可以直接使用 ngApp.factory('UserInfo', ['$http', '$q', function ($h ...
- angular学习笔记(二十九)-$q服务
angular中的$q是用来处理异步的(主要当然是http交互啦~). $q采用的是promise式的异步编程.什么是promise异步编程呢? 异步编程最重要的核心就是回调,因为有回调函数,所以才构 ...
- angularjs服务常见用法
服务可以再应用的整个生命周期内保持数据,不会在切换路由或者重新加载视图时被清楚掉(控制器只有在需要时才被实例化) 服务是一个单例对象,在每个应用中只会被实例化一次 服务在应用的生命周期内保存数据 an ...
随机推荐
- 小白日记19:kali渗透测试之选择和修改EXP
EXP 目的:学会选择和修改网上公开的漏洞利用代码[EXP(python\perl\ruby\c\c++....)] 方法: 1.Exploit-db[kali官方维护的漏洞利用代码库] 2.Secu ...
- C# 之 未能映射路径
在开发中遇到此问题,如下原码,报错:未能映射路径: string filename = Server.MapPath("/logs/log.txt"); 解决方法,从根目录开始: ...
- HTML+CSS实例——漂亮的背景(一)
一.网址:http://www.csszengarden.com/?cssfile=213/213.css 二.效果 三.CSS body { background-color:#F0ECD6; ba ...
- Android 自学之选项卡TabHost
选项卡(TabHost)是一种非常实用的组件,TabHost可以很方便地在窗口上放置多个标签页,每个标签页相当于获得了一个与外部容器相同大小的组建摆放区域.通过这种方式,就可以在一个容器中放置更多组件 ...
- jquery手写焦点轮播图-------解决最后一张无缝跳转第一张的问题
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- HTTP重定向服务器
程序基本流程如下: 代码组织结构如下: HTTP重定向服务主线程: package com.server; import java.io.IOException; import java.net.Se ...
- 双向BFS
转自“Yuan” 如果目标也已知的话,用双向BFS能很大提高速度 单向时,是 b^len的扩展. 双向的话,2*b^(len/2) 快了很多,特别是分支因子b较大时 至于实现上,网上有些做法是用两个 ...
- MSP430常见问题之复位系统类
Q1:请问msp430 怎么手动复位啊?是不是连到RST/NMI 上?但是这个脚不是和JTAG 连吗?我看到一些资料上说复位的话还要上拉电阻或者复位电路.A1:JTAG 功能只在下载程序时候使用,正常 ...
- poj 2289 网络流 and 二分查找
#include<cstdio> #include<iostream> #include<cstring> #include<algorithm> #d ...
- hihocoder 1066 无间道之并查集
#1066 : 无间道之并查集 时间限制:20000ms 单点时限:1000ms 内存限制:256MB 描述 这天天气晴朗.阳光明媚.鸟语花香,空气中弥漫着春天的气息……额,说远了,总之,小Hi和小H ...