angularjs提供的$q服务是对Promises规范的一个实现。$q服务可以把一段异步的代码封装成同步的样式。

为啥是样式,因为异步还是异步,它并不会柱塞代码,只是看起来像同步代码。

$q.when('abc').then().then();

下面的代码演示了$q的构造函数的使用方法。$q的构造函数接受一个function(resolve,reject)的函数,resolve是成功的回掉,reject是失败的回掉。

通常Ajax请求都是异步的,通过success,failed回掉来处理结果。通过$q服务我们可以把这个ajax请求改写成promise的形式。

当然这个接口是我通过$timeout服务模拟了一个2s回复的ajax请求。

html:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body ng-app="app" ng-controller="ctrl" >
<style>
.valid-error{
color:red
}
</style>
<form name="form" novalidate>
<input type="text" ng-model="id">
<input type="button" value="Test" ng-click='doTest()'>
</form>
</body>
<script src="bower_components/angular/angular.js">
</script>
<html>

javascript:

        var app = angular.module('app',[]);
app.factory('dataService',function($timeout){
var service={};
service.persons=[{id:1,name:'Jim'},{id:2,name:'Tom'},{id:3,name:'Agile'}];
service.getName=function(id,callback,errorCallback){
$timeout(function(){
for(var i in service.persons){
var person = service.persons[i];
if(person.id==id){
callback(person.name);
return;
}
}
errorCallback('can not find person by id: '+id);
},2000);
}; return service;
}); app.controller('ctrl',function($scope,$q,dataService){
$scope.id=''; function getName(id){
return $q(function(r,j){
dataService.getName(id,function(data){
r(data);
},function(data){
j(data);
});
});
}; $scope.doTest=function(){
var id = $scope.id;
getName(id).then(function(data){
alert('Name is '+data);
},function(data){
alert('failed: '+data);
});
} console.log('done'); });

then方法接受2个function作为参数,第一个是resolve,第二个是reject。其实把ajax请求改写成promise并不能体现$q的威力。

改写后代码跟原来的代码没有太大的差别。

no promise:
getName(id,function(){},function());
promise:
getName(id).then(function(){},function(){});

promise形式只是把2个回掉提到了then方法里,只是看起来更同步了一点而已。

其实$http服务本身就是通过$q来实现的promise,所以当你使用$q来做ajax的时候已经非常promise了。

$q最大的好处我觉得在于$q.all方法,它可以等待多个promise完成之后在执行相应的代码,下回分享。

AngularJs $q promise的更多相关文章

  1. angular $q promise详解

    前言 通过本文,你大概能清楚angular promise是个啥,$q又是个啥,以及怎么用它.这里咱们先灌输下promise的思想. 下面写的全是废话,一些看着高逼格其实没什么大作用的概念,想知道$q ...

  2. Nodejs Q promise设计思路

    Nodejs Q promise库 前言 Q库为nodejs提供了一个基于promise的编程方式,从此避免了一层又一层的callback调用.不过Q的灵活性也给我造成了很大困扰,我可以用promis ...

  3. Q promise API简单翻译

    详细API:https://github.com/kriskowal/q/wiki/API-Reference Q提供了promise的一种实现方式,现在在node中用的已经比较多了.因为没有中文的a ...

  4. angularJS $http $q $promise

    一天早晨,爹对儿子说:“宝儿,出去看看天气如何!” 每个星期天的早晨,爹都叫小宝拿着超级望远镜去家附近最高的山头上看看天气走势如何,小宝说没问题,我们可以认为小宝在离开家的时候给了他爹一个promis ...

  5. Q promise的使用

    虽然es6已经出现一段时间了,但是对于没有使用es6的node.js的时候,仍要解决回调金字塔,因此Q还是很有必要的.

  6. [Node.js] Promise,Q及Async

    原文地址:http://www.moye.me/2014/12/27/promise_q_async/ 引子 在使用Node/JS编程的时候,经常会遇到这样的问题:有一连串的异步方法,需要按顺序执行, ...

  7. Promise in AngularJS

    What's promise Angular’s event system provides a lot of power to our Angular apps. One of the most p ...

  8. angular的$q服务和promise模式

    此承诺/延迟(promise/deferred)实现的灵感来自于 Kris Kowal's Q CommonJS Promise建议文档 将承诺(promise) 作为和 异步执行操作(action) ...

  9. angular promise $q 异步调用

    Angular异步调用 Promise和$q的用法 背景 首先说明一下promise异步调用出现的背景: javascript语言是一种单线程模式,就是说一次只能够执行一个任务,如果有多个任务的话就必 ...

随机推荐

  1. 解决 PowerDesigner 错误 The generation has been cancelled…

    在Model Settings中按照如下图设置即可.

  2. 总结Objective-c常用算法

          今天是星期天,想睡到10点起床,结果认为自己太奢侈了,不能这么做,于是把闹钟设置成了6:30:结果终于9:36醒了,起床,无缘无故迟了,好吧,就算太累了吧,周天就原谅自己一回.终于到了中午 ...

  3. 【Java并发编程实战】-----“J.U.C”:Semaphore

    信号量Semaphore是一个控制访问多个共享资源的计数器,它本质上是一个"共享锁". Java并发提供了两种加锁模式:共享锁和独占锁.前面LZ介绍的ReentrantLock就是 ...

  4. C# 的 Dictionary 寫入前應注意事項

    一個已上線.用戶龐大的系統,幾個月來第一次出現這個系統錯誤訊息 : 「已經加入含有相同索引鍵的項目」「已添加了具有相同键的项」An item with the same key has already ...

  5. 通过圆形载入View了解自定义View

    这是自定义View的第一篇文章,通过制作简单的自定义View来了解自定义View的流程. 自定义View是Android学习和开发中必不可少的一部分.通过自定义View我们可以制作丰富绚丽的控件,自定 ...

  6. JavaScript 函数的两种声明方式

    1.函数声明的方式 JavaScript声明函数有两种选择:函数声明法,表达式定义法. 函数声明法 function sum (num1 ,num2){ return num1+num2 } 表达式定 ...

  7. 解读sencha touch移动框架的核心架构(二)

    本来这行要详解Ext.extend的,但是发现网站有很详细的,那么就跳过去吧 为保持一个系列的分析,还是先搬过来吧,下章开始分析Ext4.0的新架构 在Java中,我们在实现继承的时候存在下面几个事实 ...

  8. DOM扩展-Selectors API(选择符 API)、元素遍历

    DOM扩展 对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5 SelectorsAPI(选择符API)是由W3C发起制定的一个标准,致力于浏览器原生支持CSS查询,Sele ...

  9. 应用程序框架实战二十二 : DDD分层架构之仓储(层超类型基础篇)

    前一篇介绍了仓储的基本概念,并谈了我对仓储的一些认识,本文将实现仓储的基本功能. 仓储代表聚合在内存中的集合,所以仓储的接口需要模拟得像一个集合.仓储中有很多操作都是可以通用的,可以把这部分操作抽取到 ...

  10. Objective-C中的内存管理

    在编程语言中是少不了对内存的管理的,内存对于计算机来说是宝贵的资源,所以对使用不到的资源进行回收是很有必要的.OC中使用引用计数和垃圾回收来管理内存,在OC中为每个对象分配一个引用计数器,当对象刚刚被 ...