相關(guān)教程推薦：《angular教程》

創(chuàng)新互聯(lián)建站是一家集網(wǎng)站建設(shè),龍川企業(yè)網(wǎng)站建設(shè),龍川品牌網(wǎng)站建設(shè),網(wǎng)站定制,龍川網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷,網(wǎng)絡(luò)優(yōu)化,龍川網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力。可充分滿足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。

什么是Provider?

angularjs文檔對(duì)provider的定義:

provider是一個(gè)帶有$get()方法的對(duì)象。injector調(diào)用$get方法創(chuàng)建一個(gè)新的service的實(shí)例。provider還有一些其他的方法，可以用來(lái)配置provider。

AngularJS使用$provide注冊(cè)新的providers。providers基本上都會(huì)創(chuàng)建一個(gè)新實(shí)例, 但每個(gè)provider只創(chuàng)建一次。$provide提供了6種方法創(chuàng)建自定義provider, 我會(huì)用簡(jiǎn)單的代碼示例分別解釋他們。

6種方法如下:

constant

value

service

factory

decorator

provider

Constant

constant能被injected到任何地方。constant不能被decorator攔截, 意味著constant的值永遠(yuǎn)不能被改變。

var app = angular.module('app', []); 
app.config(function ($provide) {
  $provide.constant('movieTitle', 'The Matrix');
}); 

app.controller('ctrl', function (movieTitle) {
  expect(movieTitle).toEqual('The Matrix');
});

AngularJS提供了一種更簡(jiǎn)便的方式創(chuàng)建constant. 你可以將上面3至5行的代碼重寫(xiě)為:

app.constant('movieTitle', 'The Matrix');

Value

value是一個(gè)簡(jiǎn)單的可被注入的值，可以是string, number, 也可以是function。
與constant不同的是：value不能被注入到configurations, 但value能被decorators攔截。

var app = angular.module('app', []); 
app.config(function ($provide) {
 $provide.value('movieTitle', 'The Matrix')
});

app.controller('ctrl', function (movieTitle) {
 expect(movieTitle).toEqual('The Matrix');
})

創(chuàng)建value的簡(jiǎn)單方法：

app.value('movieTitle', 'The Matrix');

Service

service是一個(gè)可以注入的構(gòu)造函數(shù)。如果你想，你可以在函數(shù)中指定需要的依賴。

service是一個(gè)單例, 只被創(chuàng)建一次。services是一個(gè)很好的方式，用于控制器之間傳遞數(shù)據(jù)，如共享數(shù)據(jù)。

var app = angular.module('app' ,\\[\\]); 
app.config(function ($provide) {
 $provide.service('movie', function () {
   this.title = 'The Matrix';
 });
});

app.controller('ctrl', function (movie) {
 expect(movie.title).toEqual('The Matrix');
});

創(chuàng)建service簡(jiǎn)單方式:

app.service('movie', function () {
 this.title = 'The Matrix';
});

Factory

factory是一個(gè)可注入的函數(shù)。

與service的相同點(diǎn)：factory也是一個(gè)單例，也可以在此函數(shù)中指定依賴。

區(qū)別是：factory注入一個(gè)普通函數(shù)，AngularJs將調(diào)用此函數(shù)，而service注入一個(gè)構(gòu)造函數(shù)。

service是一個(gè)構(gòu)造函數(shù)，要調(diào)用new創(chuàng)建一個(gè)新對(duì)象。而用factory，你可以讓這個(gè)函數(shù)返回你想要的任何東西。
你將會(huì)看到，factory是一個(gè)只有$get方法的provider。

var app = angular.module('app', []); 
app.config(function ($provide) {
 $provide.factory('movie', function () {
   return {
     title: 'The Matrix';
   }
 });
}); 

app.controller('ctrl', function (movie) {
 expect(movie.title).toEqual('The Matrix');
});

創(chuàng)建factory的簡(jiǎn)單方式：

app.factory('movie', function () {
 return {
   title: 'The Matrix';
 }
});

Decorator

decorator可以修改或封裝其它的providers，但constant不能被裝飾。

var app = angular.module('app', []); 
app.value('movieTitle', 'The Matrix'); 
app.config(function ($provide) {
 $provide.decorator('movieTitle', function ($delegate) {
   return $delegate + ' - starring Keanu Reeves';
 });
});

app.controller('myController', function (movieTitle) {
 expect(movieTitle).toEqual('The Matrix - starring Keanu Reeves');
});

Provider

provider是所有providers中最復(fù)雜的，可以有復(fù)雜的creation函數(shù)和配置選項(xiàng)。

provider實(shí)際是一個(gè)可配置的factory。 provider接受一個(gè)對(duì)象或構(gòu)造函數(shù)。

var app = angular.module('app', []); 
app.provider('movie', function () {
 var version;
 return {
   setVersion: function (value) {
     version = value;
   },
   $get: function () {
     return {
       title: 'The Matrix' + ' ' + version
     }
   }
 }
});

app.config(function (movieProvider) {
 movieProvider.setVersion('Reloaded');
});

app.controller('ctrl', function (movie) {
 expect(movie.title).toEqual('The Matrix Reloaded');
});

總結(jié)

所有的providers只會(huì)被實(shí)例化一次，因此他們都是單例的。

除了constant，其他的providers都可以被decorated。

constant是一個(gè)值, 可以被注入到任何地方，它的值不能被改變。

value是一個(gè)簡(jiǎn)單的可注入的值。

service是一個(gè)可注入的構(gòu)造函數(shù)。

factory是以個(gè)可注入的函數(shù)。

decorator可以修改或封裝其它的providers，除了constant。

provider是一個(gè)可配置的factory。

英文原文地址：https://xebia.com/blog/differences-between-providers-in-angularjs/

相關(guān)推薦：編程教學(xué)

當(dāng)前標(biāo)題：談?wù)凙ngularJS中Providers之間的差異
瀏覽路徑：http://chinadenli.net/article2/cjigoc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供手機(jī)網(wǎng)站建設(shè)、商城網(wǎng)站、品牌網(wǎng)站建設(shè)、營(yíng)銷型網(wǎng)站建設(shè)、網(wǎng)站導(dǎo)航、企業(yè)網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)