angularJS中Provider

weixin_34162695發表於2016-05-19

factory

用 Factory 就是建立一個物件,為它新增屬性,然後把這個物件返回出來。你把 service 傳進 controller 之後,在 controller 裡這個物件裡的屬性就可以通過 factory 使用了。

You should use $provide.factory(getFn) if you do not need to configure your service in aprovider.
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 來使用了。

You should use $provide.service(class) if you define your service as a type/class.
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);

總結

  • 所有的供應商都只被例項化一次,也就說他們都是單例的
  • 除了constant,所有的供應商都可以被裝飾器(decorator)裝飾
  • value就是一個簡單的可注入的值
  • service是一個可注入的構造器
  • factory是一個可注入的方法
  • decorator可以修改或封裝其他的供應商,當然除了constant
  • provider是一個可配置的factory

相關文章