Dependency Injection (DI)
依賴注入
- 常數值 (value)
- 工廠 (factory)
- 服務 (service)
- 提供者 (provider)
- constant
類型
[Value]
Value 是一个简单的 javascript 对象，用于向控制器传递值（配置阶段）：
簡單說就是定義ㄧ個對像，並在之後使用
適用於ㄧ些參數設定上
html:
<body ng-app="mainApp">
<div ng-controller="DIController">
<div>{{result}}</div>
</div>
</body>
script: 在controller的時候要把變述帶入才有效果
var mainApp = angular.module("mainApp", []);
//建立value對像[testDIValue]，並傳遞參數"hihi"
mainApp.value("testDIValue", 'hihi');
// 將[testDIValue] 注入到控制器controller內
mainApp.controller('DIController', function($scope, testDIValue) {
$scope.result = testDIValue;
});
[factory]
factory 是一个函数用于返回值。
在 service 和 controller 需要时创建。
通常我们使用 factory 函数来计算或返回值。
直接給controller使用
var mainApp = angular.module("mainApp", []);
mainApp.factory('TestService', function() {
var factory = {};
factory.test_method = function(a, b) {
return a * b;
};
return factory;
});
mainApp.controller('DIController', function($scope, TestService) {
$scope.number = 0;
$scope.result = TestService.test_method($scope.number ,$scope.number);
$scope.doMethod = function() {
$scope.result = TestService.test_method($scope.number ,$scope.number);
};
});
透過service使用
var mainApp = angular.module("mainApp", []);
mainApp.factory('TestService', function() {
var factory = {};
factory.test_method = function(a, b) {
return a * b;
};
return factory;
});
mainApp.service('CalcService', function(TestService){
this.square = function(a) {
var b = parseInt(a)+1;
return TestService.test_method(a,b);
};
});
mainApp.controller('DIController', function($scope, CalcService) {
$scope.number = 0;
$scope.result = CalcService.square($scope.number);
$scope.doMethod = function() {
$scope.result = CalcService.square($scope.number);
};
});