Promise是一种模式,以同步操作的流程形式来操作异步事件,避免了层层嵌套,可以链式操作异步事件。

我们知道,在编写javascript异步代码时,callback是最最简单的机制,可是用这种机制的话必须牺牲控制流、异常处理和函数语义化为代价,甚至会让我们掉进出现callback大坑,而promise解决了这个问题。

 

下面实例是angularjs 的promise的实现方式:

<!DOCTYPE html>
<html ng-app="app">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src="assets/angular.min.js"></script>
</head>
<body ng-controller="ctrl"> <script type="text/javascript"> var app = angular.module("app",[]);
app.controller('ctrl', ['$scope','$q',function($scope,$q){ function okToGreet(name){
return name === 'Robin Hood';
} function asyncGreet(name) {
var deferred = $q.defer(); setTimeout(function() {
// 因为这个异步函数fn在未来的异步执行,我们把代码包装到 $apply 调用中,一边正确的观察到 model 的改变
$scope.$apply(function() {
deferred.notify('About to greet ' + name + '.'); if (okToGreet(name)) {
deferred.resolve('Hello, ' + name + '!');
} else {
deferred.reject('Greeting ' + name + ' is not allowed.');
}
});
}, 1000); return deferred.promise;
} var promise = asyncGreet('Robin Hood');
promise.then(function(greeting) {
console.info('Success: ' + greeting);
}, function(reason) {
console.info('Failed: ' + reason);
}, function(update) {
console.info('Got notification: ' + update);
});
}]); </script>
</body>
</html>

 

其中我们可以通过defered.notify ,defered.resolve,defered.reject 传递参数给其后的链式操作。

ANGULAR JS PROMISE使用的更多相关文章

  1. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  2. Angular JS中$timeout的用法及其与window.setTimeout的区别

    $timeout的用法 angular.js的$timeout指令对window.setTimeout做了一个封装,它的返回值是一个promise对象.当定义的时间到了以后,这个promise对象就会 ...

  3. [学习笔记] 七步从Angular.JS菜鸟到专家(3):数据绑定和AJAX [转]

    这是"AngularJS - 七步从菜鸟到专家"系列的第三篇. 在第一篇,我们展示了如何开始搭建一个AngularaJS应用.第二篇我们讨论了scope和 $scope 的功能. 通过这整个系列的教程 ...

  4. Angular.js!(附:聊聊非原生框架项目)

    最近,为了项目接触了一个很火的前端框架Angular.js,下面就Angular做一个简介吧(大牛请绕步,只针对没有接触过angular的人). Angular.js是一款精简的前端框架,如果要追溯它 ...

  5. angular.js 教程 -- 实例讲解

    angular.js AngularJS [1] 诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.Ang ...

  6. Angular.js中处理页面闪烁的方法详解

    Angular.js中处理页面闪烁的方法详解 前言 大家在使用{{}}绑定数据的时候,页面加载会出现满屏尽是{{xxx}}的情况.数据还没响应,但页面已经渲染了.这是因为浏览器和angularjs渲染 ...

  7. angular.js和vue.js中实现函数去抖(debounce)

    问题描述 搜索输入框中,只当用户停止输入后,才进行后续的操作,比如发起Http请求等. 学过电子电路的同学应该知道按键防抖.原理是一样的:就是说当调用动作n毫秒后,才会执行该动作,若在这n毫秒内又调用 ...

  8. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  9. angular.js:13920 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- testServe

    angular.js:13920 Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <- testSer ...

随机推荐

  1. ZOJ-2338 The Towers of Hanoi Revisited 输出汉诺塔的最优解移动过程

    题意:给定N(1<= N <=64)个盘子和M(4<= M <= 65)根柱子,问把N个盘子从1号柱子移动到M号柱子所需要的最少步数,并且输出移动过程. 分析:设f[i][j] ...

  2. ZOJ-2365 Strong Defence 无公共边割边集

    题意:该题的题意晦涩,勉勉强强听别人说了一遍后再读了一遍题才算懂了题意,题图说的是A国因为B国药进攻自己的国家,于是想办法在联通A-B之间的路径上进行阻击.阻击的舰船停留在一个路径上,舰船上都要放置水 ...

  3. Nginx基础知识之————Nginx 环境的搭建?

    本课时主要给大家讲解如何在 Linux 系统下搭建 Nginx 和 Nginx 搭建过程中常见问题的知识,并结合实例让学员掌握 Nginx 环境的搭建. 下载解压: 安装gcc-c++ 从新配置文件: ...

  4. QQReg.java

    import java.awt.*; import javax.swing.*; public class QQReg extends JFrame{ public static void main( ...

  5. Android 自定义对话框

    Android实现自定义对话框效果: 核心代码: package com.example.diydialog; import android.os.Bundle; import android.app ...

  6. Java实现分页数据获取CachedRowSet

    步骤 1.加载驱动 2.连接数据库 3.创建ResultSet 4.创建CacheRowSet 5.设置并获取分页数据 6.执行查询,展示数据 package ch13; import javax.s ...

  7. Android 中Service生命周期

    使用context.startService() 启动Service 其生命周期为context.startService() ->onCreate()- >onStart()->S ...

  8. javascript的执行顺序(转载)

    之前从JavaScript引擎的解析机制来探索JavaScript的工作原理,下面我们以更形象的示例来说明JavaScript代码在页面中的执行顺序.如果说,JavaScript引擎的工作机制比较深奥 ...

  9. Android开发面试经——4.常见Android进阶笔试题(更新中...)

      Android开发(29)  版权声明:本文为寻梦-finddreams原创文章,请关注:http://blog.csdn.net/finddreams 关注finddreams博客:http:/ ...

  10. 转载: C++ 转换构造函数 和 类型转换函数

    1.对于系统的预定义基本类型数据,C++提供了两种类型转换方式:隐式类型转换和显式类型转换. ,sum; double b=5.55; sum=a+b;//-------(1) std::cout&l ...