angularJS Provider、factory、service详解及实例代码


Posted in Javascript onSeptember 21, 2016

factory

用 Factory 就是创建一个对象,为它添加属性,然后把这个对象返回出来。你把 service 传进 controller 之后,在 controller 里这个对象里的属性就可以通过 factory 使用了。

app.controller('myFactoryCtrl', function($scope, myFactory){
  $scope.artist = myFactory.getArtis();
});
app.factory('myFactory', function(){
  var _artist = '';
  var service = {};

  service.getArtist = function(){
    return _artist;
  }
  return service;
});

service

Service 是用"new"关键字实例化的。因此,你应该给"this"添加属性,然后 service 返回"this"。你把 service 传进 controller 之后,在controller里 "this" 上的属性就可以通过 service 来使用了。

app.controller('myFactoryCtrl', function($scope, myService){
  $scope.artist = myService.getArtis();
});
app.service('myService', function(){
  var _artist ='';
  this.getArtist = function(){
    return _artist;
  }
});

provider

Providers 是唯一一种你可以传进 .config() 函数的 service。当你想要在 service 对象启用之前,先进行模块范围的配置,那就应该用 provider。

app.controller('myProviderCtrl', function($scope, myProvider){
  $scope.artist = myProvider.getArtist();
  $scope.data.thingFromConfig = myProvider.thingOnConfig;
});
app.provider('myProvider', function(){
  this._artist = '';
  this.thingFromConfig = '';

  this.$get = function(){
    var that = this;
    return {
       getArtist: function(){
         return that._artist;
       },
       thingOnConfig: that.thingFromConfig
    }
  }
});
app.config(function(myProviderProvider){
  myProviderProvider.thingFromConfig = 'This was set in config()';
});

value和constant

$provide.value('myValue', 10);
$provide.constant('myConstant', 10);
/*


二者的区别:
1. value可以被修改,constant一旦声明就无法修改
2. value不可以在config中注入,constant可以。
*/

provider、factory、service三者的关系

app.provider('myDate', { 
  $get: function() { 
   return new Date(); 
  }
});
//可以写成
app.factory('myDate', function(){ 
 return new Date();
});
//可以写成
app.service('myDate', Date);

总结

  1. 所有的供应商都只被实例化一次,也就说他们都是单例的
  2. 除了constant,所有的供应商都可以被装饰器(decorator)装饰
  3. value就是一个简单的可注入的值
  4. service是一个可注入的构造器
  5. factory是一个可注入的方法
  6. decorator可以修改或封装其他的供应商,当然除了constant
  7. provider是一个可配置的factory

以上就是对angularJS Provider、factory、service的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
jQuery中add实现同时选择两个id对象
Oct 22 Javascript
JavaScript在for循环中绑定事件解决事件参数不同的情况
Jan 20 Javascript
jquery解析XML字符串和XML文件的方法说明
Feb 21 Javascript
图文详解Heap Sort堆排序算法及JavaScript的代码实现
May 04 Javascript
JavaScript数组的栈方法与队列方法详解
May 26 Javascript
Bootstrap响应式侧边栏改进版
Sep 17 Javascript
jQuery获取this当前对象子元素对象的方法
Nov 29 Javascript
微信小程序实现日期格式化和倒计时
Nov 01 Javascript
使用微信SDK自定义分享的方法
Jul 03 Javascript
node读写Excel操作实例分析
Nov 06 Javascript
微信小程序云开发获取文件夹下所有文件(推荐)
Nov 14 Javascript
解决vue elementUI 使用el-select 时 change事件的触发问题
Nov 17 Vue.js
JS实现图文并茂的tab选项卡效果示例【附demo源码下载】
Sep 21 #Javascript
AngularJS ngModel实现指令与输入直接的数据通信
Sep 21 #Javascript
D3.js实现折线图的方法详解
Sep 21 #Javascript
利用BootStrap弹出二级对话框的简单实现方法
Sep 21 #Javascript
angular route中使用resolve在uglify压缩后问题解决
Sep 21 #Javascript
使用bootstrap validator的remote验证代码经验分享(推荐)
Sep 21 #Javascript
D3.js实现柱状图的方法详解
Sep 21 #Javascript
You might like
php中将指针移动到数据集初始位置的实现代码[mysql_data_seek]
2012/11/01 PHP
带密匙的php加密解密示例分享
2014/01/29 PHP
微信公众号开发客服接口实例代码
2016/10/21 PHP
如何解决PHP获取不到SESSION信息之一般情况
2019/10/10 PHP
映彩衣的js随笔(js图片切换效果)
2011/07/31 Javascript
js和jquery使按钮失效为不可用状态的方法
2014/01/26 Javascript
JS实现简易图片轮播效果的方法
2015/03/25 Javascript
微信小程序-消息提示框实例
2016/11/24 Javascript
深入理解JavaScript创建对象的多种方式以及优缺点
2017/06/01 Javascript
基于JavaScript实现图片连播和联级菜单实例代码
2017/07/28 Javascript
vue.js中父组件调用子组件的内部方法示例
2017/10/22 Javascript
javascript回调函数详解
2018/02/06 Javascript
JavaScript设计模式之装饰者模式定义与应用示例
2018/07/25 Javascript
解决vuejs项目里css引用背景图片不能显示的问题
2018/09/13 Javascript
总结javascript三元运算符知识点
2018/09/28 Javascript
nodejs检测因特网是否断开的解决方案
2019/04/17 NodeJs
Vue源码学习之关于对Array的数据侦听实现
2019/04/23 Javascript
用vue 实现手机触屏滑动功能
2020/05/28 Javascript
[50:29]2014 DOTA2华西杯精英邀请赛 5 24 DK VS iG
2014/05/26 DOTA
剖析Python的Twisted框架的核心特性
2016/05/25 Python
python实现对excel进行数据剔除操作实例
2017/12/07 Python
python2 与 pyhton3的输入语句写法小结
2018/09/10 Python
python PyQt5/Pyside2 按钮右击菜单实例代码
2019/08/17 Python
selenium中get_cookies()和add_cookie()的用法详解
2020/01/06 Python
基于梯度爆炸的解决方法:clip gradient
2020/02/04 Python
TensorFlow实现指数衰减学习率的方法
2020/02/05 Python
Python Matplotlib简易教程(小白教程)
2020/07/28 Python
台湾最大银发乐活百货:乐龄网
2018/05/21 全球购物
东芝官网商城:还原日式美学,打造美好生活
2018/12/27 全球购物
如何用Lucene索引数据库
2016/02/23 面试题
社会稳定风险评估方案
2014/06/02 职场文书
公司年会开场白
2015/06/01 职场文书
导游词之塘栖古镇
2019/12/04 职场文书
详解Go与PHP的语法对比
2021/05/29 PHP
python之django路由和视图案例教程
2021/07/26 Python
Redis中key的过期删除策略和内存淘汰机制
2022/04/12 Redis