【AngularJS中的自定义服务service VS factory VS provider】---它们的区别,你知道么?
在介绍AngularJS自定义服务之前,我们先来了解一下AngularJS~
学过HTML的人都知道,HTML是一门很好的伪静态文本展示设计的声明式语言,但是,要构建WEB应用的话它就显得乏力了。
而AngularJS是为了克服HTML在构建应用上的不足而设计的。
AngularJS是一款优秀的前端JS框架,已经被用于Google的多款产品当中。它有着诸多特性,最为核心的是:MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等……
AngularJS通过新的属性和表达式扩展了HTML;可以构建一个单一页面应用程序;而且学习起来非常简单。
有了以上的了解,我们来看一下AngularJS中的自定义服务。
angularjs中可通过三种方式自定义服务,
分别为$service,$factory,$provider。
下面我就给大家分别介绍一下三种AngularJS自定义服务的区别:
一、服务service
第一次被注入时实例化,只实例化一次,整个应用的生命周期中是个单例模式,可以用来在controller之间传递数据;
使用new关键字实例化,所以直接使用this定义service,如果你不知道原因,就看看js中的this。
例如:
.service('myService', ['', function() {
this.getName = function() {
return 'CooMark';
}
}])
内置服务:
>>> 使用内置服务,必须在Controller中通过函数的参数注入进来!!!!!
$location:返回当前页面的 URL地址。
$http:向服务器发送请求,应用响应服务器传送过来的数据,类似于Ajax
$timeout:相当于setTimeout();
$interval:相当于setInterval();
(参考代码)body部分:
<body ng-app="app" ng-controller="ctrl">
<p>[功能]<br />
{{gongneng}}
</p>
<p>255转为16进制为:{{num}}</p>
</body>
(参考代码)JS部分:
先导入JS文件angular.js!!!
<script src="libs/angular.js"></script>
<script>
angular.module("app",[])
.controller("ctrl",function($scope,$location,$timeout,$interval,$hexafy){ // $scope.local = $location.$$absUrl;
// $scope.local = $location.absUrl(); $scope.local = $location.$$host; $timeout(function () {
$scope.myHeader = "How are you today?";
}, 2000);
$scope.num = 0; $interval(function(){
$scope.num ++;
},1000); $scope.gongneng = $hexafy.$$gongneng;
$scope.hexafy = $hexafy;
}) /*自定义服务*/
.service('$hexafy', function() {
this.$$gongneng = "将转入的数字,转为16进制";
this.myFunc = function (x) {
return x.toString(16);
}
}) /*自定义过滤器*/
.filter("filt",function(){
return function(x){
return x.toString(16);
}
})
/*在过滤器中,调用自定义服务*/
.filter("filt1",function($hexafy){
return function(x){
return $hexafy.myFunc(x);
}
}) </script>
二、服务factory
factory是一个函数用于返回值,通常我们使用factory函数来计算或返回值。
factory使用上,与service差距不大。
(参考代码) body部分参考服务Service,JS代码如下:
先导入JS文件angular.js!!!
<script src="libs/angular.js"></script>
<script>
angular.module("app",[])
.config()
.controller("ctrl",function($scope,hexafy){
$scope.gongneng = hexafy.gongneng;
$scope.num = hexafy.myFunc(255);
})
.factory('hexafy',function(){
var obj = {
gongneng : "将转入的数字,转为16进制",
myFunc:function(x){
return x.toString(16);
}
};
return obj;
}) </script>
三、服务provider
1、在AngularJS中,Service,factory都是基于provider实现的。
2、在provider中,通过$get()方法提供了factory的写法,用于返回 value/service/factory。;
3、provider是三种自定义服务中,唯一可以写进config配置阶段的一种。
如果服务,必须要在配置阶段执行,那么必须使用provider。否则,一般使用Service或factory。
四、扩展:angularjs的依赖注入和自定义服务有什么区别
AngularJS实际上是在调用前面出现的代码(就是$provide.provider的版本)。
从字面上来说,angularjs的依赖注入和自定义服务基本上没有差别。
value方法也一样,如果我们需要从$get函数(也就是我们的factory函数)返回的值永远相同的话,
我们可以使用value方法来编写。
好了~~~今天的博客内容就先分享到这里,欢迎留言~~~
大家一起加油哦!一起学习,一起进步!
【AngularJS中的自定义服务service VS factory VS provider】---它们的区别,你知道么?的更多相关文章
- AngularJS 1.x系列:AngularJS服务-Service、Factory、Provider、Value及Constant(5)
1. AngularJS服务 AngularJS可注入类型包括:Service.Factory.Provider.Value及Constant. 2. Service AngularJS Servic ...
- 深究AngularJS——自定义服务详解(factory、service、provider)
前言 3种创建自定义服务的方式. Factory Service Provider 大家应该知道,AngularJS是后台人员在工作之余发明的,他主要应用了后台早就存在的分层思想.所以我们得了解下分 ...
- angularJs 自定义服务 provide 与 factory 的区别
<!DOCTYPE html> <html lang="en" ng-app="myApp"> <head> <met ...
- AngularJs:Service、Factory、Provider依赖注入使用与区别
本教程使用AngularJS版本:1.5.3 AngularJs GitHub: https://github.com/angular/angular.js/ ...
- 跟我学AngularJs:Service、Factory、Provider依赖注入使用与差别
林炳文Evankaka原创作品. 转载请注明出处http://blog.csdn.net/evankaka 本教程使用AngularJs版本号:1.5.3 AngularJ ...
- Android系统在新进程中启动自定义服务过程(startService)的原理分析
在编写Android应用程序时,我们一般将一些计算型的逻辑放在一个独立的进程来处理,这样主进程仍然可以流畅地响应界面事件,提高用户体验.Android系统为我们提供了一个Service类,我们可以实现 ...
- anjular中Service、Factory、Provider的使用与js中创建对象的总结
在学习anjular中Service的使用时,发现和js中的创建对象的方式有一定的联系,所以总结了anjular中Service.Factory.Provider的使用方式与js创建对象的方式 一.先 ...
- AngularJS中service,factory,provider的区别(转载:http://my.oschina.net/tanweijie/blog/295067)
目录[-] 一.service引导 二.service 1.factory() 2.service() 3.provider() 一.service引导 刚开始学习Angular的时候,经常 ...
- AngularJS中service,factory,provider的区别
一.service引导 刚开始学习Angular的时候,经常被误解和被初学者问到的组件是 service(), factory(), 和 provide()这几个方法之间的差别.This is whe ...
随机推荐
- 老李分享:《Java Performance》笔记1——性能分析基础 1
老李分享:<Java Performance>笔记1——性能分析基础 1.性能分析两种方法: (1).自顶向下: 应用开发人员通过着眼于软件栈顶层的应用,从上往下寻找性能优化的机会. ...
- 性能调优案例分享:jvm crash的原因 2
3.core dump分析 有了core dump文件,接下来要做的就是通过命令去解析此文件,定位具体问题了,主要有以下三个命令: (1)先执行gdb $JAVA_HOME$/bin/java cor ...
- [android] 手机卫士黑名单功能(ListView结合SQLite增删改)
修改界面,在顶部横条上增加一个添加按钮,点击打开一个自定义对话框,输入电话号码和拦截模式保存到数据库 自定义对话框看这篇http://www.cnblogs.com/taoshihan/p/53703 ...
- 1.熟悉Java基本类库系列 - 目录
写这个系列是想让自己多熟悉熟悉Java的基本类库,忘记的时候可以在这里看看之前写过的例子,这样就可以很快的回忆起来如何使用了. 这样就可以很节省时间了. ======= 下面是传送门啦 ======= ...
- 在SrollView中嵌套GridView或ListView(转)
原文链接:http://blog.csdn.net/gaojinshan/article/details/17055511 我想在同一个界面中,使用两个GridView,两个GridView一起上下滚 ...
- 关于laravel框架的跨域请求/jsonp请求的理解
最近刚接触laravel框架,首先要写一个跨域的单点登录.被跨域的问题卡了两三天,主要是因为对跨域这快不了解,就在刚才有点茅塞顿开的感觉,我做一下大概整理,主要给一些刚接触摸不着头脑的看,哪里写得不对 ...
- Nginx VS Apache
作为 Web 服务器:相比 Apache,Nginx 使用更少的资源,支持更多的并发连接,体现更高的效率 Nginx 静态处理性能比 Apache 高 3倍以上 最核心的区别在于apache是同步多进 ...
- 发散问题——Spring容器及加载
一.前言 发散问题系列,是围绕日常工作,发散思考,提取问题,并寻求答案的一个系列.总的来说,就是将遇到的问题发散来提出更多的问题,并通过解决发散问题,从而对问题有更深入的了解,对知识有更深刻的记忆,帮 ...
- Html 经典布局(二)
经典布局案例(二): <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...
- 使用RandomAccessFile类对文件进行读写
1. RandomAccessFile类简介 前面一篇随笔<File类遍历目录及文件>中有说到,File类只能用于表示文件或目录的名称.大小等信息,而不能用于文件内容的访问.而当需要访 ...