angularjs中factory, service和provider
在Angular里面,services作为单例对象在需要到的时候被创建,只有在应用生命周期结束的时候(关闭浏览器)才会被清除。而controllers在不需要的时候就会被销毁了(因为service的底层机制是通过闭包实现,如果过分使用会导致内存泄露从而导致性能问题)
如何创建一个service
每个service方法中,我们都会看到两个参数:
1.name------service的名字
2.function------service中包含的代码
angularjs中有3种创建service的方法:service(),factory()和provider()。
(1) factory()
Angular里面创建service最简单的方式是使用factory()方法
factory()让我们通过返回一个包含service方法和数据的对象来定义一个service
在service方法里面我们可以注入services,比如 $http 和 $q等
factory()的示例代码:
angular.module('myApp.services')
.factory('User', function($http) { // factory的名字和注入的方法
var backendUrl = "http://localhost:3000";
var service = { //把我们定义的方法和数据都放到一个对象中,并且返回这个对象,这就是factory
user: {}, //数据
setName: function(newName) { //方法
service.user['name'] = newName;
},
setEmail: function(newEmail) {
service.user['email'] = newEmail;
},
save: function() {
return $http.post(backendUrl + '/users', {user: service.user });
}
};
return service;
});
在controller中使用factory(),将factory的名字注入即可
angular.module('myApp')
.controller('MainCtrl', function($scope, User) { //User就是factory()的名字
$scope.saveUser = User.save; //我们将User这个factory中的一个叫做save()的function赋给我们controller中的变量
});
什么时候使用factory()?
在service里面当我们仅仅需要的是一个方法和数据的集合且不需要处理复杂的逻辑的时候,factory()是一个非常不错的选择
也就是说,我们可以用factory()来当做一个仓库,存储着我们的function和data
注意:需要使用.config()来配置service的时候不能使用factory()方法
(2) service()
service()通过构造函数的方式让我们创建service,和factory()方法一样我们也可以在函数的定义里面看到服务的注入
service()示例代码:
angular.module('myApp.services')
.service('User', function($http) { // 在这里注入我们需要的服务
var self = this; //由于service()是通过构造函数创建的,那么service()中的function和data都要以this.data和this.function的方式进行声明
//service()方法会持有构造函数创建的对象
this.user = {};
this.backendUrl = "http://localhost:3000";
this.setName = function(newName) {
self.user['name'] = newName;
}
this.setEmail = function(newEmail) {
self.user['email'] = newEmail;
}
this.save = function() {
return $http.post(self.backendUrl + '/users', {user: self.user });
}
});
在controller中使用service(),和factory()一样,将service的名字注入到controller中即可
angular.module('myApp')
.controller('MainCtrl', function($scope, User) {//注入名字为User的service
$scope.saveUser = User.save; //用User中名字叫做的save的function给本地变量赋值
});
什么时候使用service()?
与factory()相比,由于service是通过构造函数的方式创造的,且持有创造对象本身,所以当我们在功能比较复杂的情况下,可以
通过service()中的方法和数据对controller中的变量进行赋值,从某种角度来说,service()和factory()的实现方式不同,但是二者在使用场景上却很接近
注意:需要使用.config()来配置service的时候不能使用service()方法
(3)provider
provider()是创建service最底层的方式,这也是唯一一个可以使用.config()方法配置创建service的方法
provider()不同于service()和factory(),在注入其他的服务的时候不能在function()中注入
angular.module('myApp.services')
.provider('User', function() {
this.backendUrl = "http://localhost:3000";
this.setBackendUrl = function(newUrl) {
if (url) this.backendUrl = newUrl;
}
this.$get = function($http) { // 在这里注入其他服务,不同于factory()与service()中的在//function()中引入
var service = {
user: {},
setName: function(newName) {
service.user['name'] = newName;
},
setEmail: function(newEmail) {
service.user['email'] = newEmail;
},
save: function() {
return $http.post(self.backendUrl + '/users', {user: service.user})
}
}
};
return service;
});
provider()是唯一一个可以在config()中进行配置的service
angular.module('myApp')
.config(function(UserProvider) { //在.config()中配置provider
UserProvider.setBackendUrl("http://myApiBackend.com/api");
})
配置之后,我们才可以在controller中正常使用provider()
angular.module('myApp')
.controller('MainCtrl', function($scope, User) { //注入名字为User的provider()
$scope.saveUser = User.save;
});
什么时候使用.provider()?
1.当我们希望在应用开始前对service进行配置的时候就需要使用到provider()。比如,比如我们开发时要用到多个环境,测试环境,正式环境等,我们在应用初始化时,可以对provider()进行初始化
2.当我们打包发布时,如果我们要用到可配置的service时,我们必须选择provider()
总结:
1.factory()就像一个仓库一样,存储着我们的方法和数据
2.service()在创建时会持有当前对象,调用了这个service()的对象就会被赋值(方法或者数据)
3.provider()是唯一一个可以在config()中进行配置的service,它在设计上和用处上与以上二者区别明显
转自:https://blog.csdn.net/sourcecode_poet/article/details/53509851
angularjs中factory, service和provider的更多相关文章
- angularjs 中 Factory,Service,Provider 之间的区别
本片文章是使用了 angularjs 中使用 service 在controller 之间 share 对象和数据 的code(http://jsfiddle.net/kn46u0uj/1/) 来进行 ...
- angularjs 中使用 service 在controller 之间 share 对象和数据
在做angularjs 的UI 时,我们经常会遇到一个页面之间有几个controller,在controller 之间share 公共的一些数据和方法就变得比较困难,目前推荐的做法是创建一个servi ...
- AngularJS中使用service,并同步数据
service是单例对象,在应用中不同代码块之间共享数据. 对一些公用的方法封装到service中,然后通过依赖注入在Controller中调用,示例代码: 1.创建一个模块: var module ...
- 我也谈“the difference between Factory, Service, and Provider in Angular”
看完这篇文章之后的理解与实践:原文地址:http://tylermcginnis.com/angularjs-factory-vs-service-vs-provider/ <!doctype ...
- AngularJS 之 Factory vs Service vs Provider【转】
英文原文:AngularJS: Factory vs Service vs Provider 当你初试 Angular 时,很自然地就会往 controller 和 scope 里堆满不必要的逻辑.一 ...
- AngularJS之Factory vs Service vs Provider
原文 http://www.linuxeden.com/html/news/20140509/151538.html 当你初试 Angular 时,很自然地就会往 controller 和 scop ...
- [转载]AngularJS之Factory vs Service vs Provider
http://www.oschina.net/translate/angularjs-factory-vs-service-vs-provider http://tylermcginnis.com/a ...
- 【AngularJS中的自定义服务service VS factory VS provider】---它们的区别,你知道么?
在介绍AngularJS自定义服务之前,我们先来了解一下AngularJS~ 学过HTML的人都知道,HTML是一门很好的伪静态文本展示设计的声明式语言,但是,要构建WEB应用的话它就显得乏力了. 而 ...
- AngularJS 中的 factory、 service 和 provider区别,简单易懂
转自:http://blog.csdn.net/ywl570717586/article/details/51306176 初学 AngularJS 时, 肯定会对其提供 factory . serv ...
随机推荐
- java C# objective-c AES对称加解密
/** * AES加解密 */ public class AESHelper { final static String AES_KEY = "43hr8fhu34b58123"; ...
- [转]Web Api系列教程第2季(OData篇)(二)——使用Web Api创建只读的OData服务
本文转自:http://www.cnblogs.com/fzrain/p/3923727.html 前言 很久没更新了,之前有很多事情,所以拖了很久,非常抱歉.好了,废话不多说,下面开始正题.本篇仍然 ...
- SQL Serever学习10——T-SQL语句
在sqlserver2018中使用的是Transact-SQL语言,简称T-SQL. 数据库的创建和管理 数据定义语言DDL DDL功能包括数据库,表,索引,视图,存储过程 数据库:CREATE DA ...
- web.xml文件初始化过程
在使用各种框架后,有时会发现不了了错误处在哪里,了解Servlet的初始化过程(也可以说是web.xml的初始化吧),也许对你对于框架的理解与报错的原因理解会有帮助 context-param > ...
- Java学习--Java 中的包装类
Java 中的包装类 相信各位小伙伴们对基本数据类型都非常熟悉,例如 int.float.double.boolean.char 等.基本数据类型是不具备对象的特性的,比如基本类型不能调用方法.功能简 ...
- spring-cloud-sleuth简单使用
快速开始 一.导入依赖 <!--链路追踪 start--> <dependency> <groupId>org.springframework.cloud</ ...
- 10、springboot之集成druid
在pom.xml中添加 <dependency> <groupId>com.alibaba</groupId> <artifactId>druid< ...
- Java - 线程基本概念
[java并发编程实战]-----线程基本概念 线程状态图 说明:线程共包括以下5种状态.1. 新建状态(New) : 线程对象被创建后,就进入了新建状态.例如,Thread thre ...
- Mysql分布式部署高可用集群方案
HAproxy+Mycat +MySQL主从集群高可用方案 1. HAproxy高可用方案: haproxy+keepalived,利用keepalived的VIP浮动能力,(多台ha ...
- 关于AJAX的一些事
在JQ中运用AJAX的操作是很舒服的一件事,一直以来我对他都有个错误的认识,直到遇见了问题才把他研究个透彻. 下面贴出两种AJAX的写法,当然都是正确的. 其一: $.ajax({ type: 'po ...