1. 程式人生 > >AngularJS依賴註入

AngularJS依賴註入

igp demo efault scrip cto return cal 分離 a*

wki上依賴註入的解釋:Dependency injection是一種軟件設計模式(簡稱DI),在這種模式下,一個或者更多的依賴(服務)被註入(或者通過引用傳遞)到一個獨立的對象中,然後成為了該獨立對象的一部分。

DI分離了客戶端依賴本身行為的創建,使得程序設計模式變得松耦合,並遵循依賴反轉和單一職責,域服務定位器模式形成了直接的對比,DI允許客戶端了解客戶端如何使用該系統找到依賴,可以這樣理解:沒有事你不要來找我,有事我去找你。

AngularJS提供了很好的依賴註入機制,以下5個核心組件用來作為依賴註入:value、factory、service、provider、constant。下面一一簡單學習一下。

1、Value

Value是一個簡單的JavaScript對象,用來向控制器傳遞值(配置階段),如下例子:

var app=angular.modulr("demo",[]);

app.value("defaultinput",5);

app.controller("mycontroller",function($scope,CalcService,defaultinput){

$scope.number=defaultinput;

$scope.result=CalcService.square($scope.number);

$scope.square=function(){

$scope.result=CalcService.square($scope.number);

}

});

2、Factory

factory是一個函數用於返回值。在service和controller需要時創建。通常我們使用factory函數來計算或者返回值。如下使用實例:

var app=angular.module("myapp",[]);

app.factory("MathService",function(){

var factory={};

factory.multiply=function(a,b){

return a*b;

}

return factory;

});

app.service("CalcService",function(MathService){

this.suqare=function(a){

return MathService.multiply(a,a);

}

});

3、provider

AngularJS中通過provider創建一個service、factory等,provider中提供一個factory方法get,用於返回value\service\factory。

var app=angular.module("app",[]);

app.config(function($provider){

$provider.provider("MathService",function(){

this.$get=function(){

var factory={};

factory.multiply=function(a,b){

return a*b;

}

return factory;

}

});

});

4、constant

constant用來在配置階段傳遞數值,但是要註意這個常量在配置階段是不可用的。

  app.constant("configProgram","constant value");

AngularJS依賴註入