我可以將角度控制器和指令放在單獨的 JS 文件中嗎？

Question

我正在使用 angular 1.5.x 。

我目前有兩個文件，一個是指令，另一個是指令使用的控制器。

指令.js

(function(){
    var myApp = angular.module('legalentity');
  myApp.directive("banks", function() {
        return {
            controller: bankController,
            template: "<div ng-include='banks-tab.html'></div>"
        };
    });
}());

我有一個單獨的文件，其中定義了 BankController。

(function () {

    var myApp = angular.module("legalentity");

    myApp.controller("bankController", 'BankController');

    BankController.$inject = ['RDS_BASE_URL'];

    function BankController(RDS_BASE_URL) {
        var entityID = 1001;
        $scope.bankGrid = {
            dataSource: RDS_BASE_URL + '/entity/' + entityID + '/bankdetails/',
            filterRow: {
                visible: true
            },
            headerFilter: {
                visible: true
            },
            groupPanel: {
                visible: true
            }
        };
    }
}());

我的頁面沒有加載，因為指令找不到 bankController 錯誤如下 ReferenceError: bankController is not defined

請您建議如何解決這個問題？ 我想將控制器和指令保存在單獨的 JS 文件中。

Answer 1

嘗試這個：

controller: 'bankController'

此外，而不是這一行：

myApp.controller("bankController", 'BankController');

寫這個：

myApp.controller("bankController", BankController);

以下是對正在發生的事情的解釋：

當您編寫控制器：bankController 時，它會嘗試在您的指令中找到一個名為 bankController 的對象，但它無法找到它。 但是當你說“bankController”時，它會嘗試在當前模塊中找到一個具有這個名稱的對象。 雖然它在不同的文件中，但 angular 能夠找到並使用它。

在第二種情況下，如果你說

myApp.controller("bankController", 'BankController');

它嘗試將一個字符串分配給我認為應該導致 js 錯誤的控制器（嘗試檢查您的控制台），因此您的控制器甚至不會由於此錯誤而被創建。 相反，我們為它分配 BankController，這是它可以在文件中找到的一個函數，並將其用作控制器定義。