angularjs 系列之$q和promise
还是同一个项目,在项目中,发现多个controller之内有一个共同的服务器请求,当时只是不断的重复使用,如今,现在项目结束,代码开始走向了优化迭代的阶段;
首先,我的思路是把这个共同的请求,从controller里抽出来,做成一个服务,然后在需要的controller里注入;
第一个问题是请求服务器数据:
var app = angular.module('testApp',['ui.bootstrap']);
app.factory('myService',['$http','$q',function($http,$q){
return {
query : function() {
var deferred = $q.defer(); // 声明延后执行,表示要去监控后面的执行
$http({method: 'GET', url: 'data.php'}).success(function(data, status, headers, config) {
deferred.resolve(data); // 声明执行成功,即http请求数据成功,可以返回数据了
}).error(function(data, status, headers, config) {
deferred.reject(data); // 声明执行失败,即服务器返回错误
});
return deferred.promise; // 返回承诺,这里并不是最终数据,而是访问最终数据的API
}, // end query
title : '页面标题设置'
};
}]);
至于promise,这里我简单的说,他是一个对象,也是一种异步编程模式,要了解详细,请到这里js 异步编程。
服务创建之后,把服务创建到controller里,调用就可以跑起来了。
app.controller('myController',function($scope,myService){
var use = myService.query(); //调用服务里的query函数
use.then(function(data){//then是回调函数,里面可以写user.then(successFun(),errFun());
$scope.version = data;//data 是promise的返回数据
});
setTimeout(function(){
console.log($scope.version);
},1);
var tit = myService.title;
$scope.title = tit;
});
这个是使用factory创建的服务,创建服务还有其他方式:service()、provider()等;
这个例子是关于服务里中包含服务器交互的一个方法,需要的小伙伴可以参考;
注意:服务里不能注入$scope这个对象;
angularjs 系列之$q和promise的更多相关文章
- AngularJS 系列 学习笔记 目录篇
目录: AngularJS 系列 01 - HelloWorld和数据绑定 AngularJS 系列 02 - 模块 (持续更新)
- 浅谈Angular的 $q, defer, promise
浅谈Angular的 $q, defer, promise 时间 2016-01-13 00:28:00 博客园-原创精华区 原文 http://www.cnblogs.com/big-snow/ ...
- AngularJS 系列 01 - HelloWorld和数据绑定
目录导读: AngularJS 系列 学习笔记 目录篇 前言: 好记性不如烂键盘,随笔就是随手笔记,希望以后有用. 本篇目录: 1. Hello World 2. AngularJS中的数据绑定 3. ...
- AngularJS 系列 02 - 模块
引导目录: AngularJS 系列 学习笔记 目录篇 前言: 其实,在上篇文章介绍数据绑定的时候,我们的HelloWorld的代码案例中就已经使用了模块(module).哈哈. 本篇就着重介绍一下a ...
- AngularJS系列之总结
AngularJS深入的系列就是这九篇博客了,把我以前在项目中应用到的和自己学习的都总结在了里面.为了更方便的看,把我写的AngularJS系列的博客都列到下面.之后就开始学习ionic:html5移 ...
- angularjs系列之轻松使用$q进行异步编程
第一部分关于js中的异步编程 异步编程简单的说就是你写了一段代码,但他不会按照你书写代码的顺序立即执行,而是等到程序中发生了某个事件(如用户点击了某个按钮,某个ajax请求得到了响应)才去执行这段代码 ...
- [AngularJS] AngularJS系列(7) 进阶篇之promise
目录 使用promise 补充说明 $q.all $q.when 在上节中,我们在http中使用了then 和 在ngResource中返回了一个'延迟对象'. 本节介绍一下angular中的prom ...
- [AngularJS] AngularJS系列(2) 中级篇之路由
目录 原理 angular-route ui-router 事件 深度路由 原理 ng的route本质是监听hashchange事件. 在angular-route中 $rootScope.$on(' ...
- Angularjs中的$q详解
先说说什么是Promise,什么是$q吧.Promise是一种异步处理模式,有很多的实现方式,比如著名的Kris Kwal's Q还有JQuery的Deffered. 什么是Promise 以前了解过 ...
随机推荐
- ArrayList add remove 代码分析
Add 首次add 元素需要对数组进行扩容(初始化Capacity 10, 第二次扩容10>>1 为5, 第三次扩容15>>1 为7), 每次扩容之前长度的1.5倍,当add ...
- 利用NIO的Selector处理服务器-客户端模型
package NIOTEST; import java.io.IOException; import java.net.InetAddress; import java.net.InetSocket ...
- GNU LD 脚本学习笔记
LD脚本(linker script)是什么 GNU ld是链接器,ld实际并不是GCC的一部分,ld属于binutils软件包.但是嵌入式开发时,下载的linaro GCC工具集中是包含 arm-l ...
- PyCharm搭建Spark开发环境 + 第一个pyspark程序
一, PyCharm搭建Spark开发环境 Windows7, Java 1.8.0_74, Scala 2.12.6, Spark 2.2.1, Hadoop 2.7.6 通常情况下,Spark开发 ...
- Vim使用技巧(1) -- 普通模式技巧 【持续更新】
直观的来一张键盘图先 符号快捷键 . //重复上次修改 ^ //光标快速跳转到当前行开头 $ //光标快速跳转到当前行结尾 f{char} //光标快速跳转到当前行下一个{char}字符,{char} ...
- PL/0编译程序
Pl/0语言文法的BNF表示: 〈程序〉→〈分程序>. 〈分程序〉→ [<常量说明部分>][<变量说明部分>][<过程说明部分>]〈语句〉 <常量说明部 ...
- centos set up samba
原文中文链接:https://wiki.centos.org/zh/HowTos/SetUpSamba 原文英文链接:https://wiki.centos.org/HowTos/SetUpSamba ...
- Largest Rectangle in a Histogram (最大子矩阵)
hdu 1506 A histogram is a polygon composed of a sequence of rectangles aligned at a common base line ...
- IoC原理及实现
什么是IoC IoC是Inversion of Control的缩写,翻译过来为"控制反转".简单来说,就是将对象的依赖关系交由第三方来控制.在理解这句话之前,我们先来回顾一下I ...
- UnicodeEncodeError: 'latin-1' codec can't encode characters in position 0-3: ordinal not in range(256)
今天使用MySQLdb往MySQL插入中文数据遇到一个异常: UnicodeEncodeError: 'latin-1' codec can't encode characters in positi ...