angularjs---服务(service / factory / provider)
初angularJs时 常写一些不够优雅的代码 !我总结了一下看看各位有没有中枪的!-----( 这里只针对服务service及其相关! )
以下做法不太优雅
- 兄弟controller 之间的相同的业务逻辑的实现 靠 从父 controller 通过继承实现. ×
- 将大量的不必要的业务逻辑和持久化的数据 堆放在 $scope 和controller中. ×
- ......
其实我们应该把业务逻辑和持久化的数据尽量放在service中
从内存性能的角度来看,只有在需要controller的时候才去加载,一旦不需要就应该抛弃,每次刷新都应该清除controller
而service 是个单例对象,只有在使用的时候才会被创建,在其生命周期内都有效(浏览器关闭之前).而且可以注入到不同controller中
因此service 更适合存放持久化的数据和绝大部分的业务逻辑.
angular 中提供了三种创建服务的方式
- service
- factory
- provider
service --- 实质是使用'new'进行了实例化 然后就可以在controller中调用service中this的方法和数据
var app = angular.module('myApp', []);
app.controller('rainCtrl', ['$scope', 'firstService',function($scope,firstService) {
$scope.name = firstService.name;
}]); app.service('firstService', function() {
this.name = 'rain_tdk';
})
但是一般人不会直接把数据暴露出来 一般应该是这个样子的
var app = angular.module('myApp', []);
app.controller('rainCtrl', ['$scope', 'firstService',function($scope,firstService) {
$scope.name = firstService.getName();
}]); app.service('firstService', function() {
var name = 'rain_tdk';
this.getName = function(){
return this.name = name;
}
})
factory --- 返回的一定是一个引用类型
var app = angular.module('myApp', []);
app.controller('rainCtrl', ['$scope', 'secondService',function($scope,secondService) {
$scope.name = secondService.name;
}]); app.factory('secondService', function(){
return {
name:"rain_tdk"
}
})
provider
provider是唯一一个可以传.config()函数的service. 如果想在service对象启动之前,先进行模块范围的配置,就应该选择provide....
注意:在config函数 里注入 provide时 有特殊的命名规则: provideName+Provider,控制器中要调用的在$get中返回
优点: 可以在可以在Provide 对象传递到应用程序的其他controller 之前在.config()函数中对其进行修改
var app = angular.module('myApp', []);
app.controller('rainCtrl', ['$scope', 'thirdService', function($scope, thirdService) {
$scope.name = thirdService.name;
}]); app.config(function(thirdServiceProvider) {
thirdServiceProvider.name = 'rain_tdk2';
}); app.provider('thirdService', function() {
this.name = 'rain_tdk1'; this.$get = function() {
var _this = this;
return {
name: _this.name
}
}
}) 现在看看源码
可以看出什么他们三个方法是一个德行的 哈哈哈哈...
小伞(rain_tdk) 技术有限...如果出现错误请大神指正.如有疑问也欢迎大家一起研讨...
angularjs---服务(service / factory / provider)的更多相关文章
- angular 服务 service factory provider constant value
angular服务 服务是对公共代码的抽象,由于依赖注入的要求,服务都是单例的,这样我们才能到处注入它们,而不用去管理它们的生命周期. angular的服务有以下几种类型: 常量(Constant): ...
- AngularJS 1.x系列:AngularJS服务-Service
1. AngularJS服务 AngularJS可注入类型包括:Service.Factory.Provider.Value及Constant. 2. Service AngularJS Servic ...
- AngularJS 1.x系列:AngularJS服务-Service、Factory、Provider、Value及Constant(5)
1. AngularJS服务 AngularJS可注入类型包括:Service.Factory.Provider.Value及Constant. 2. Service AngularJS Servic ...
- AngularJS服务及注入--Provider
Provider简介 在AngularJS中,app中的大多数对象通过injector服务初始化和连接在一起. Injector创建两种类型的对象,service对象和特别对象. Service对象由 ...
- angularjs model.service vs provider vs factory?
<!DOCTYPE html> <html ng-app="app"> <head> <script src="http://c ...
- AngularJS 服务(Service)
AngularJS 中你可以创建自己的服务,或使用内建服务. 什么是服务? 在 AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用. AngularJS 内建了30 ...
- 41.AngularJS 服务(Service)
转自:https://www.cnblogs.com/best/tag/Angular/ 什么是服务? 在 AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用. A ...
- angularjs服务-service
Service 的特性 ①service都是单例的 ②service由$injector 负责实例化 ③service在整个应用的声明周期中存在,可以用来共享数据 ④在需要使用的地方利用依赖注入ser ...
- AngularJS学习之旅—AngularJS 服务(八)
1.AngularJS 服务(Service) AngularJS 中你可以创建自己的服务,或使用内建服务.2.什么是服务? 在 AngularJS 中,服务是一个函数或对象,可在你的 Angular ...
随机推荐
- JS跨域代码
//部分JS代码 $.ajax({ async: false, url: "http://www.xxxx.com/api/", type: "GET",//不 ...
- linux proxy
ALL_PROXY=socks://192.168.2.1:3128/ HTTPS_PROXY=https://192.168.2.1:3128/HTTP_PROXY=http://192.168.2 ...
- css设置层级显示
效果: 代码: <li id="tabIdcontent4" class="nomal" tabid="content4" style ...
- Java时间操作(一):关于UTC格式时间处理
Java中获取形如:20160811T122132+08 格式,可以通过如下方法 package com.mc.others; public class UTCTimeTest { @Test pub ...
- HTTP协议详解 转自小坦克
-- 此文章是转载小坦克的;直接复制文章的目的是因为原文章地址经常被重置,找不到原来的文章.小坦克博客园主页:https://home.cnblogs.com/u/TankXiao/ 当今web程序的 ...
- PAT (Advanced Level) 1001. A+B Format (20)
简单题. #include<iostream> #include<cstring> #include<cmath> #include<algorithm> ...
- vector与ArrayList、hashmap与hashtable区别
一.vector与ArrayList区别 首先要说明的是vector和arraylist都是list的实现类,都是代表链表的数据结构. java.util.Vector; 类中 pa ...
- html5新增标签集锦
<keygen></keygen><meter low="69" high="80" max="100" op ...
- android Makefile把jar包打到apk里
这个是经常的需求,我就是经常忘,关键不理解啊. 反反复复的也看看了android makefile. 太复杂了. 慢慢来吧.哎.工作十年.啥也不会.咋整? ## Copyright (C) 2008 ...
- Bestcoder #80
首先吐槽一下,ca爷出的这套题到处都是坑,bestcoder变成besthack,Ranting已经掉得不能看了 A题: 链接:http://acm.hdu.edu.cn/showproblem.ph ...