9、使用Promises

Promises，是Javascript表现item的一种方式。它执行异步工作，在未来的某个时间点完成。遇到最多的promises，是使用Ajax请求。浏览器在后台发起HTTP请求，当请求完成，会使用promise提醒你的应用。在线面，作者创建了一个最小的AngularJS应用，来做一个Ajax请求。

<!DOCTYPE html>

<html ng-app="demo">

<head>

<title>Example</title>

<script
src="angular.js"></script>

<link
href="bootstrap.css"
rel="stylesheet"
/>

<link
href="bootstrap-theme.css"
rel="stylesheet"
/>

<script
type="text/javascript">

var myApp = angular.module("demo",
[]);

myApp.controller("demoCtrl",
function
($scope, $http)
{

var promise = $http.get("todo.json");

promise.success(function
(data)
{

$scope.todos = data;

});

});

</script>

</head>

<body ng-controller="demoCtrl">

<div
class="panel">

<h1>To Do</h1>

<table
class="table">

<tr><td>Action</td><td>Done</td></tr>

<tr ng-repeat="item in todos">

<td>{{item.action}}</td>

<td>{{item.done}}</td>

</tr>

</table>

</div>

</body>

</html>

作者创建了一个AngularJS模块，给他定义了一个叫做demoCtrl的控制器。该控制器使用$scope对象，提供数据给视图。

该模块，控制器，和视图，

var promise = $http.get("todo.json");

promise.success(function (data) {

$scope.todos = data;

});

$http服务（作者将在第20章描述），用于做Ajax请求，get方法含有你想要从服务器得到的文件的URL。

Ajax请求以异步执行，浏览器继续运行该程序，知道请求完成。$http.get方法返回一个promise对象，作者可以用来接收关于Ajax请求的提醒。在该例中，作者使用success方法来注册一个callback函数，当请求完成后被触发。Callback函数从服务器接收数据，作者用来指派一个属性给$scope。这时，ng-repeat指令使用to-do items分发table的内容。Success方法是三个promise对象定义中的一个。

Name

Description

Error(callback)

指定一个callback函数，当Promise不能完成时，被调用

Success(callback)

指定一个callback函数，当Promise完成时，被调用

Then(success,err)

指定一个callback，如果promise成功或失败时被调用

这里有三个方法，以函数作为参数，基于promise的返回状态调用。Success callback函数，传递从服务器获取的数据，error callback接收遇到的问题明细。

提示：可以把promise定义的方法，理解为事件。

所有三种promise方法，返回其他promise对象，允许异步任务链式调用。

<!DOCTYPE html>

<html ng-app="demo">

<head>

<title>Example</title>

<script
src="angular.js"></script>

<link
href="bootstrap.css"
rel="stylesheet"
/>

<link
href="bootstrap-theme.css"
rel="stylesheet"
/>

<script
type="text/javascript">

var myApp = angular.module("demo",
[]);

myApp.controller("demoCtrl",
function
($scope, $http)
{

$http.get("todo.json").then(function
(response)
{

$scope.todos = response.data;

},
function
()
{

$scope.todos =
[{action:
"Error"}];

}).then(function
()
{

$scope.todos.push({action:
"Request Complete"});

});

});

</script>

</head>

<body ng-controller="demoCtrl">

<div
class="panel">

<h1>To Do</h1>

<table
class="table">

<tr><td>Action</td><td>Done</td></tr>

<tr ng-repeat="item in todos">

<td>{{item.action}}</td>

<td>{{item.done}}</td>

</tr>

</table>

</div>

</body>

</html>

这里，作者使用then方法两次，第一次处理$http.get方法的相应。

更多的Promise的例子在第20章，和第21章。

 

 

 

 

 

5.1JavaScript精华的更多相关文章

  1. 如何找出标有"App Store 精华"，"Essentials"的所有软件？

    如何找出标有"App Store 精华","Essentials"的所有软件? 中国区: +"App Store 精华" site:http ...

  2. Web 前端开发精华文章集锦（jQuery、HTML5、CSS3）【系列十七】

    <Web 前端开发精华文章推荐>2013年第五期(总第十七期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各种增强网站用户体验的 jQuery 插件,展示前沿的 HTML5 和 C ...

  3. iteye上总结的编程精华资源

    原文:http://www.iteye.com/magazines/130 博客是记录学习历程.分享经验的最佳平台,多年以来,各路技术大牛在ITeye网站上产生了大量优质的技术文章,并将系列文章集结成 ...

  4. MVCC PostgreSQL实现事务和多版本并发控制的精华

    原创文章,同步发自作者个人博客,http://www.jasongj.com/sql/mvcc/ PostgreSQL针对ACID的实现机制 事务的实现原理可以解读为RDBMS采取何种技术确保事务的A ...

  5. 【资源】C++学习资料 - 逆天整理 - 精华无密版【最新】

    再失效就太无语了,链接都是多份的~~—————————————————基础——————————————C++环境搭建(全套)http://pan.baidu.com/s/1o6y0smY链接:http ...

  6. Web 开发精华文章集锦（jQuery、HTML5、CSS3）【系列二十七】

    <Web 前端开发精华文章推荐>2014年第6期(总第27期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...

  7. Web 前端开发人员和设计师必读精华文章【系列二十六】

    <Web 前端开发精华文章推荐>2014年第5期(总第26期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...

  8. Web 前端开发精华文章推荐（HTML5、CSS3、jQuery）【系列二十三】

    <Web 前端开发精华文章推荐>2014年第2期(总第23期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML5 ...

  9. Web 前端开发精华文章推荐（HTML5、CSS3、jQuery）【系列二十二】

    <Web 前端开发精华文章推荐>2014年第一期(总第二十二期)和大家见面了.梦想天空博客关注 前端开发 技术,分享各类能够提升网站用户体验的优秀 jQuery 插件,展示前沿的 HTML ...

随机推荐

  1. RouteOS软路由HotSpot热点认证网关添加白名单和黑名单

    1.添加白名单和黑名单地址池 白名单IP地址池 172.18.10.0/24 黑名单IP地址池 172.18.20.0/24 2.添加IP网关 白名单网关 172.18.10.0/24 黑名单网关 1 ...

  2. WordPress 性能检测与速度优化

    来源:SayBlog.Me [摘要]在如何提升WordPress性能与速度方面多花一些时间是值得的,本文下面为大家就如何提升WordPress运行效率列出了几点建议以供参考. 你的WordPress博 ...

  3. Hadoop学习（4）-- MapReduce

    MapReduce是一种用于大规模数据集的并行计算编程模型,由Google提出,主要用于搜索领域,解决海量数据的计算问题.其主要思想Map(映射)和Reduce(规约)都是从函数是编程语言中借鉴而来的 ...

  4. eclipse不自动弹出提示

    最近公司电脑上的Eclipse没有了自动提示功能,也不是全部不提示,大多数情况下按下“alt+/”键还会产生提示,但是当我在java项目中邪main方法和syso的时候,“alt+/”则会失效,今天在 ...

  5. JDK安装 配置环境变量

    我将JDK安装在D盘中 在D盘中新建一个文件 文件名为JAVA 运行jdk安装软件 更改jdk安装路径为 下一步 等待jdk安装完成 安装jre路径 jre路径改为 点击下一步 等待jre安装完成 注 ...

  6. Centos7 安装 Nginx

    Nginx有很多版本的,下面我给个链接http://nginx.org/packages/mainline/centos/7/x86_64/RPMS/ 下载对应当前系统版本的nginx包(packag ...

  7. Nginx简介

    序言Nginx 是 lgor Sysoev 为俄罗斯访问量第二的 rambler.ru 站点设计开发的.从 2004 年发布至今,凭借开源的力量,已经接近成熟与完善.Nginx 功能丰富,可作为 HT ...

  8. 树形DP（简单题）（Y HDU4705）

    题意:给出一个n个节点的树形图,统计{A,B,C}的数量,其中ABC分别是树上三个不同的节点,并且这三个节点不能被一条路径覆盖 分析:对于下图 进行dfs深搜统计,num[u]统计回溯到当前节点u,并 ...

  9. editPlus修改默认的文件编码

  10. sql set xact_abort on 用例

    set xact_abort on 设置事务回滚的当为ON时,如果你存储中的某个地方出了问题,整个事务中的语句都会回滚为OFF时,只回滚错误的地方 例子 : ALTER proc [dbo].[BuC ...