使用繫結縮小
$ scope 注入控制器的建構函式的方式是一種演示和使用角度依賴注入的基本選項的方法,但不能生產就緒,因為它不能縮小。那是因為縮小系統改變了變數名稱,而 anguar 的依賴注入使用引數名來知道必須注入什麼。因此,舉例來說,ExampleController 的建構函式被縮減為以下程式碼。
function n(n){this.setUpWatches(n)
而 $scope
改為 n
!
為了克服這個問題,我們可以新增一個$ inject 陣列(string[]
)。因此,角度的 DI 知道在控制器建構函式的哪個位置注入什麼。
所以上面的 TypeScript 改為
module App.Controllers {
class Address {
line1: string;
line2: string;
city: string;
state: string;
}
export class SampleController {
firstName: string;
lastName: string;
age: number;
address: Address;
setUpWatches($scope: ng.IScope): void {
$scope.$watch(() => this.firstName, (n, o) => {
//n is string and so is o
});
};
static $inject : string[] = ['$scope'];
constructor($scope: ng.IScope) {
this.setUpWatches($scope);
}
}
}