angular中使用promise
promise是一种用异步的方式处理值的方法，promise是对象，代表了一个函数最终可能的返回值或者抛出的异常，在与远程对象打交道时我们可以把他看作是远程对象的一个代理。 如果说是promise也是异步处理方式的一种，那么我们会想起它和XHR和$.ajax有啥区别呢？
习惯上js使用闭包或者回调来相应非同步返回的数据，比如页面加载之后的XHR请求。我们可以跟数据进行正常交互，就好像它已经返回了一样，而不需要依赖回调函数的触发。
那么ng提出的promise是为了解决什么问题呢？ 回调已经被使用了很长时间，通常如果有回调依赖其他还回调时将会时调试变得非常艰难，每一步调用之后都需要显示处理错误。与之不同的是promise提供了另外一个抽象：这些函数返回promise对象。
从一定层面上看ng改变的不是简单的改变代码风格，而是让我对一些思维习惯发起了反思和改善。
常规模式，即回调方法：
User.get(fromId,{
success:function(){
user.friends.find(toId,function(){})
},
failure:function(){}
})
使用ng的$q模式
User.get(fromId).
then(function(user){ },function(err){ })
使用了promise的收获之一是逃脱了回调的固定思维逻辑。promise让异步处理的机制看上去更像是同步，基于同步函数我们可以按照预期来捕获返回值和异常值。可以在程序中的任何时刻捕捉错误，并且绕过依赖于程序异常的后续代码，我们不需要思考这个同步带来的好处。因此使用promise的目的是：获取功能组合和错误冒泡能力的同时，保持代码异步运行的能力。
promise是头等对象，自带了一些约定。
- 只有一个resolve或者reject会被调用到。
- 如果promise被执行或者被拒绝了，依赖于他们的处理程序仍然会被调用。
- 处理程序总是会被异步调用。
要创建一个deferred对象，可以调用defer()方法； var deferred= $q.defer()
deferred对象暴露了三个方法，以及一个可以用于处理promise的promise属性。
- resolve(value)。 deferred.resolve({name:"Kobe",Age:36});
- reject(reason)。 deferred.reject("Can't update user");
- notify(value)。这个方法用promise的执行状态进行响应。
- then(successFn,errFn,notifyFn)。
- catch(errFn)。
- finally(callback)。finally允许我们观察promise的执行或者拒绝，而无需修改结果的值。通常就做一些资源的清理工作。
链式请求：
GitHubService.then(function(data){
}).then(function(data){
$scope.Users=data;
});
完整例子：
app.js
angular.module('startApp',[
'service',
'demo-controller'
])
controller.js
angular.module('demo-controller',['service'])
.controller('demoCtrl',function(BaseService,$scope,$q){
BaseService.getNews()
.then(function(success){
$scope.newLists = success.newslist;
},function(error){
console.log(error);
})
})
service.js
angular.module('service',[])
.service('BaseService',baseService);
function baseService($q,$http){
this.page = 1;
this.num = 10;
this.baseUrl = 'http://api.huceo.com/guonei/?key=eea12a5aad62c67d0052a563bc86c9e5';
this.getNews = function(){
var deferred = $q.defer();
//
$http.get(this.baseUrl,{
params:{
key:"eea12a5aad62c67d0052a563bc86c9e5",
num:10,
page:1
}
})
.success(function(success){
deferred.resolve(success);
})
.error(function(error){
deferred.reject(error);
})
return deferred.promise;
}
}
demo.html
<!doctype html>
<html lang="en" ng-app="startApp">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script src="http://cdn.bootcss.com/angular.js/1.4.0-rc.1/angular.js"></script>
<script src="js/app.js"></script>
<script src="js/service.js"></script>
<script src="js/controller.js"></script>
</head>
<body>
<div ng-controller="demoCtrl">
<ul>
<li ng-repeat="item in newLists">{{item.title}}</li>
</ul>
</div>
</body>
</html>
angular中使用promise的更多相关文章
- angular中的promise
angular中的promise用法 标签(空格分隔): angular 前言 Promise其实是一个规范,用类似then().then()这样的链式调用形式来处理因为异步带来意大利面条式的代码(多 ...
- 浅谈angular中的promise
promise目的就是为了跳出回调地狱.老掉牙的东西,大神轻拍. 举个最简单的例子:请求数据(getData),解析数据(executeData),显示数据(showData). //获取数据 fun ...
- 深入理解jQuery、Angular、node中的Promise
最初遇到Promise是在jQuery中,在jQuery1.5版本中引入了Deferred Object,这个异步队列模块用于实现异步任务和回调函数的解耦.为ajax模块.队列模块.ready事件提供 ...
- Angularjs中的promise
promise 是一种用异步方式处理值的方法,promise是对象,代表了一个函数最终可能的返回值或抛出的异常.在与远程对象打交道非常有用,可以把它们看成一个远程对象的代理. 要在Angular中创建 ...
- Angular中的$q的形象解释及深入用法
作者:寸志链接:https://zhuanlan.zhihu.com/p/19622332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 早上,老爸说:“儿子,天气如何 ...
- 形象的讲解angular中的$q与promise（转）
以下内容摘自http://www.ngnice.com/posts/126ee9cf6ddb68 promise不是angular首创的,作为一种编程模式,它出现在……1976年,比js还要古老得多. ...
- promise在angular中的基本使用
promise在angular中的基本使用 <!DOCTYPE html> <html ng-app="myApp"> <head> <m ...
- 原创：形象的讲解angular中的$q与promise
promise不是angular首创的,作为一种编程模式,它出现在……1976年,比js还要古老得多.promise全称是 Futures and promises.具体的可以参见 http://en ...
- Deferred在jQuery和Angular中的使用与简单实现
Deferred在jQuery和Angular中的使用与简单实现 Deferred是在jQuery1.5版本中加入的,并且jQuery使用它完全重写了AJax,以前也只是偶尔使用.但是上次在使用Ang ...
随机推荐
- ExtJs之列表(grid)
--renderers渲染器 可以格式化该列显示的数据格式或者按照你自定义的脚本显示最终数据样子 先看下renderer: function()里的参数 renderer:function(value ...
- Codeforces Round #425 (Div. 2) Misha, Grisha and Underground（LCA）
Misha, Grisha and Underground time limit per test 2 seconds memory limit per test 256 megabytes inpu ...
- putty对Linux上传下载文件或文件夹
putty是一个开源软件,目前为止最新版本为0.70.对于文件或文件夹的上传下载,在Windows下它提供了pscp和psftp两个命令. (1).pscp pscp在命令提示符中使用,只要putty ...
- [Lydsy1805月赛] quailty 算法
稍微建一下模型就可以发现,题目要求的其实是一个最小异或基环森林.... 可以用类似最小生成树的拟阵性质来证明,贪心的从小的边权开始依次尝试加入的方法是对的. 所以我们把a[]排完序之后直接递归贪心就行 ...
- bzoj 2159: Crash 的文明世界
Time Limit: 10 Sec Memory Limit: 259 MB Submit: 480 Solved: 234[Submit][Status][Discuss] Descripti ...
- 【随机化】Petrozavodsk Summer Training Camp 2016 Day 5: Petr Mitrichev Contest 14, Saturday, August 27, 2016 Problem I. Vier
给你一个1~n的排列,让你找出4个下标a b c d,满足 (a+b)%n=(c+d)%n (w(a)+w(b))%n=(w(c)+w(d))%n,并且是非平凡解. 发现对于每个数i,找出两个数和为其 ...
- 浅析position:relative position:absolute
定位一直是WEB标准应用中的难点,如果理不清楚定位那么可能应实现的效果实现不了,实现了的效果可能会走样.如果理清了定位的原理,那定位会让网页实现的更加完美. 定位的定义: 在CSS中关于定位的内容是: ...
- Dell最近的几款显示器看上去还不错的样子
发现最近戴尔最近发布了两款的4k显示器P2415Q和P2715Q,价格还比较平易近人,淘宝价24寸3700,27寸4700,让人有点心动了.基本参数如下: 3840*2160分辨率 亮度350cd/m ...
- Run-Time Check Failure #0
Run-Time Check Failure #0 - The value of ESP was not properly saved across a function call. This is ...
- AS3.0纯代码编写的两款loading效果
AS3.0纯代码编写的两款loading效果 效果一 效果二 代码很简单,实现的原理一样,只不过矩形用到了Matrix类,对注册点进行了调整,效果可用于视频播放器缓冲时的loading效果,下面看代码 ...