欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2023-01-13 17:48:14
factory 用 factory 就是创建一个对象,为它添加属性,然后把这个对象返回出来。你把 service 传进 controller 之后,在 control...

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的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!