1.学习一下Angularjs的promisee
1.首先来了解一下promisee:
在谈论Promise
之前我们要了解一下一些额外的知识;我们知道JavaScript语言的执行环境是“单线程”,所谓单线程,就是一次只能够执行一个任务,如果有多个任务的话就要排队,前面一个任务完成后才可以继续下一个任务。
这种“单线程”的好处就是实现起来比较简单,容易操作;坏处就是容易造成阻塞,因为队列中如果有一个任务耗时比较长,那么后面的任务都无法快速执行,或导致页面卡在某个状态上,给用户的体验很差。
当然JavaScript提供了“异步模式”去解决上述的问题,关于“异步模式”JavaScript提供了一些实现的方法。
- 回调函数(callbacks)
- 事件监听
- Promise对象
2.在Angularjs中使用promisee:
//使用$q服务 创建defer对象
var defer = $q.defer(); //通过defer对象创建promise对象
var promise = defer.promise;
3.defer有哪些方法:
promise.then(function_success(value){
console.log("in promise ---- success");
console.log(value);
},function_error(error){
console.log("in promise ---- error");
console.log(value);
});
(1).resolve(param): 当defer对象调用resolve方法时,会回调ptomise.then里面的
function_success方法。
(2).reject(param):当defer对象调用reject方法时,会回调ptomise.then里面的
function_error方法。 来一个小demo
<html>
<head>
<meta charset="utf-8">
<title>学习AngularJS promise</title>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head> <body>
<div ng-app="MyApp">
<div ng-controller="MyController">
<label for="flag">成功
<input id="flag" type="checkbox" ng-model="flag" /><br/>
</label>
<div ng-cloak>
{{status}}
</div>
<hr/>
<button ng-click="handle()">点击我</button>
</div>
</div>
</body> <script>
angular.module("MyApp", [])
.controller("MyController", ["$scope", "$q", function ($scope, $q) {
$scope.flag = false;
$scope.handle = function () {
var deferred = $q.defer();
var promise = deferred.promise; promise.then(function (result) {
console.log("1");
result = result + "you have passed the first then()";
$scope.status = result;
return result;
}, function (error) {
console.log("3");
error = error + "failed but you have passed the first then()";
$scope.status = error;
deferred.reject("my test.");
return error;
}).then(function (result) {
console.log("4");
alert("Success: " + result);
}, function (error) {
console.log("5");
alert("Fail: " + error);
}) if ($scope.flag) {
console.log("2");
deferred.resolve("you are lucky!");
} else {
console.log("0");
deferred.reject("sorry, it lost!");
}
}
}]); </script>
执行结果:当$scope.flag=true 时,执行顺序时:2、1、4.
得益于看了这个博客:https://segmentfault.com/a/1190000002788733。
1.学习一下Angularjs的promisee的更多相关文章
- 前端MVC学习总结——AngularJS验证、过滤器
前端MVC学习总结--AngularJS验证.过滤器 目录 一.验证 二.过滤器 2.1.内置过滤器 2.1.1.在模板中使用过滤器 2.1.2.在脚本中调用过滤函数 2.2.自定义过滤器 三.指令( ...
- 学习笔记-AngularJs(十)
前面一直在说自定义指令,但是却一直没有一次系统地去了解,现在需要我们一起来学习如何去使用自定义指令,去丰富html标签.属性,实现多元化.多功能的标签(或是属性).辣么,啥是指令?要了解指令,首先需要 ...
- 学习笔记-AngularJs(九)
到目前为止,我们所做的学习案例都是没有加任何动画效果的,对于以往来说,我们经常会去使用一些动画插件或是css框架(如:animate.css)来点缀我们的网页,这样显得生动,高大上,那么接下来我们可以 ...
- 学习笔记-AngularJs(七)
在学习笔记-AngularJs(六)提及了事件处理器和过滤器以及它们的例子,而我们知道之前我是使用$http服务去获得我们需要的json数据,但是$http是比较底层的用法,有时候我们想把获取json ...
- 学习笔记-AngularJs(六)
在学习笔记-AngularJs(五),通过引入bootstrap.css进行改写整个样式,这时学习项目也变得好看多了,现在我们又需要目录再进行一次改变,如下图: 这样就符合之前讲的对学习目录进行布置了 ...
- 学习笔记-AngularJs(三)
学习笔记-AngularJs(二)写了个所有程序语言入门时都必须要写的Hello World,那么从现在开始做那个之前说过的互联网大佬介绍的学习例子,当然这里开始会慢慢按照之前说过的目录来搭建这个学习 ...
- 学习笔记-AngularJs(二)
在接下来学习angularjs中,我按照的就是之前 学习笔记-AngularJs(一)所讲的目录来搭建一个学习的项目,做一个互联网大佬人物简介的例子,当然也可以使用angualrjs上面提供的官方例子 ...
- AngularJs学习笔记-AngularJS权威教程学习笔记
AngularJS是什么? AngularJS是一种构建动态Web应用的结构化框架.主要用于构建单页面Web应用, 增加抽象级别,使构建交互式的现代Web应用变得更加简单. AngularJS使开发W ...
- 学习笔记-AngularJs(八)
在使用form.FormController和ngModel.NgModelController之前,先来学习一下怎么一个ng-model-options指令,觉得怎么这个指令挺好用的,我们知道ng- ...
随机推荐
- mysql 表中数据不存在则插入,否则更新数据
在很多时候我们会操作数据库表,但是在向表中插入数据时,会遇到表中已经存在该id的数据或者没有该id的数据的情况,没有该id的数据的情况时直接插入就OK,遇到已经存在该id的数据的情况则更新该id的数据 ...
- Piggy-Bank HDU - 1114 完全背包
#include<iostream> #include<cstring> using namespace std; const int INF=0x3f3f3f3f; ]; s ...
- 云服务器 使用 onedrive 快速同步
重大更新:支持微软的onedrive网盘,可以自动实时双向同步数据,也可以多台服务器和网盘之间实时同步数据.新增了一个虚拟环境python367,支持pytorch1.2:-----------微软O ...
- path('<int:question_id>/vote/', views.vote, name='vote')中的<int:question_id>的含义
path('<int:question_id>/vote/', views.vote, name='vote')<int:question_id>用于匹配URL的值,并将扑捉到 ...
- 智能手机中下一次被消灭的部件是电话卡和TF卡
智能手机中下一次被消灭的部件是电话卡和TF卡. 侧滑实体键盘,实体拍照键,HDMI外接接口,实体切换双卡键,可拆卸后盖……这些都消亡了,被其更好的内在设计所取代.而电话卡和TF卡仍在使用.将来的智能手 ...
- Goland安装与配置
前言 工欲善其事必先利其器,学习Go语言同样如此,一个强大的集成开发环境(IDE)能够大大提高我们的开发效率,目前市面上比较流行的有下面这几种: GoLand:由 JetBrains 公司开发的一个新 ...
- vba工程密码清除
EXCEL vba工程密码破解 方法一:这种方法实际是避开VBA工程密码验证,即骗vba编辑器,该密码输入成功,请求放行.不管他是破解还是欺骗 能达到我们的目的角开就行________________ ...
- HttpApplication处理管道处理过程简单描述
HttpApplication对象是由Asp.net帮助我们创建的,它是asp.net中处理请求的重要对象.为了便于扩展,HttpApplication采用处理管道的方式进行处理,将处理的步骤分为多个 ...
- 常用excel函数公式及操作示例
一.数字处理 1.取绝对值 =ABS(数字) 2.取整 =INT(数字) 3.四舍五入 =ROUND(数字,小数位数) 二.判断公式 1.把公式产生的错误值显示为空 公式:C2 =IFERROR(A2 ...
- Andre Weil的一生
在20世纪的数学家中,Andre Weil(1906-1998)以其渊博的学识.坎坷的经历和超凡的人格魅力成为引人注目的一员. 他无疑是20世纪最伟大的数学家之一.国际数学家大会把数学划分为19个大的 ...