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 相关文章推荐
脚本之家贴图转换+转贴工具用到的js代码超级推荐
Apr 05 Javascript
js数值和和字符串进行转换时可以对不同进制进行操作
Mar 05 Javascript
详解JavaScript中getFullYear()方法的使用
Jun 10 Javascript
Node.js 条形码识别程序构建思路详解
Feb 14 Javascript
微信小程序 富文本转文本实例详解
Oct 24 Javascript
使用Math.max,Math.min获取数组中的最值实例
Apr 25 Javascript
微信小程序注册60s倒计时功能 使用JS实现注册60s倒计时功能
Aug 16 Javascript
vue 使用自定义指令实现表单校验的方法
Aug 28 Javascript
JavaScript 处理树数据结构的方法示例
Jun 16 Javascript
vue 中几种传值方法(3种)
Nov 12 Javascript
javascript实现鼠标点击生成文字特效
Dec 24 Javascript
Vue router安装及使用方法解析
Dec 02 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使用wordwrap格式化文本段落的方法
2015/03/17 PHP
php获取图片信息的方法详解
2015/12/10 PHP
PHP中each与list用法分析
2016/01/08 PHP
php之可变变量的实例详解
2017/09/12 PHP
thinkphp5框架结合mysql实现微信登录和自定义分享链接与图文功能示例
2019/08/13 PHP
用JSON做数据传输格式中的一些问题总结
2011/12/21 Javascript
仿新浪微博返回顶部的jquery实现代码
2012/10/01 Javascript
Lab.js初次使用笔记
2015/02/28 Javascript
javascript中scrollTop详解
2015/04/13 Javascript
JavaScript学习小结(7)之JS RegExp
2015/11/29 Javascript
快速掌握Node.js环境的安装与运行方法
2016/02/16 Javascript
工作中比较实用的JavaScript验证和数据处理的干货(经典)
2016/08/03 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
2017/09/20 Javascript
快速解决vue在ios端下点击响应延时的问题
2018/08/27 Javascript
Vue实现页面添加水印功能
2019/11/09 Javascript
VUE.CLI4.0配置多页面入口的实现
2019/11/25 Javascript
js正则匹配多个全部数据问题
2019/12/20 Javascript
JavaScript setInterval()与setTimeout()计时器
2019/12/27 Javascript
在vue中使用Base64转码的案例
2020/08/07 Javascript
在vue项目中引用Antv G2,以饼图为例讲解
2020/10/28 Javascript
python进阶教程之文本文件的读取和写入
2014/08/29 Python
在Python中封装GObject模块进行图形化程序编程的教程
2015/04/14 Python
通过mod_python配置运行在Apache上的Django框架
2015/07/22 Python
python实现简单socket通信的方法
2016/04/19 Python
python 排序算法总结及实例详解
2016/09/28 Python
Python自动生产表情包
2017/03/17 Python
Python 模拟购物车的实例讲解
2017/09/11 Python
python pandas中对Series数据进行轴向连接的实例
2018/06/08 Python
对python sklearn one-hot编码详解
2018/07/10 Python
css3绘制天猫logo实现代码
2012/11/06 HTML / CSS
STRATHBERRY苏贝瑞包包官网:西班牙高级工匠手工打造
2020/11/10 全球购物
实习生工作证明范本
2014/09/14 职场文书
2015年学习部工作总结范文
2015/03/31 职场文书
python使用XPath解析数据爬取起点小说网数据
2021/04/22 Python
解决pycharm安装scrapy DLL load failed:找不到指定的程序的问题
2021/06/08 Python
python获取字符串中的email
2022/03/31 Python