1. 程式人生 > >AngularJS DI(依賴註入)實現推測

AngularJS DI(依賴註入)實現推測

.html app message ups 兩個 fine rip 聲明 ssa

AngularJS DI(依賴註入)

http://www.cnblogs.com/whitewolf/archive/2012/09/11/2680659.html

回到angularjs:在框架中為我們提供了angular.injector(modules)DI註入註射器。但是在我們使用註入的時候常常是不需要關心具體的如何註入。我們只需要按照其規則書寫我們的angularjs代碼就會很容易的得到angularjs的DI特性

1:推斷式註入:在angularjs中我們可以在我們需要註入的地方按照名稱註入,這裏要求參數名稱必須和註入服務實例名稱相同,一種名稱約定。angularjs會提取參數名稱查找相應DI實例註入。

例如:

var myModule = angular.module(‘myModule‘, []);

myModule.factory(‘$alert‘, function($window) {

    return {
        alert: function(text) {
            $window.alert(text);
        }
    };
});

var myController = function($scope, $alert) {
    $scope.message = function(msg) {
        console.log(msg);
        $alert.alert(msg);
    };
};
myModule.controller("myController", myController);?

分析

控制器 myController 是一個函數, 其具有 $scope, $alert 兩個參數,

這兩個參數 第一個是APP應用域, 第二個是依賴的服務, 其實現為 myModule.factory 定義的 $alert 服務。

myController 控制器,在html 聲明時候,被初始化, 即使被調用。如下HTML

<div ng-app="myModule"  ng-controller="myController" ng-init="msg=‘test for alert‘" >
    <input ng-model="msg">
<button ng-click="message(msg);">click me</button>
   <br/> {{msg}}
</div>

未見任何調用 myController 地方,如何控制入參傳入? 且 $alert參數能對應到 myModule.factory 定義的 $alert 服務??

猜測是框架實現的調用流程,並將 服務註入到 myController 控制器, 當控制器被初始化時。

具體牽扯到JS函數定義具有自省性質, 使用toString方法,並將參數名解析出來, 然後到 服務列表中找到 參數名對應的服務, 然後調用 myController 方法。

JS的自省測試如下:

function test($scope, $alert) {console.log("aaa")}

test.toString().match(/\([^\(\)]*\)/)
["($scope, $alert)", index: 13, input: "function test($scope, $alert) {console.log("aaa")}", groups: undefined]0: "($scope, $alert)"groups: undefinedindex: 13input: "function test($scope, $alert) {console.log("aaa")}"length: 1__proto__: Array(0)
test.toString().match(/\([^\(\)]*\)/)[0] "($scope, $alert)"

參考:

https://segmentfault.com/q/1010000002581288

AngularJS DI(依賴註入)實現推測