angular.js - ocLazyLoad配合ui-router延遲載入controller，controller提示 not a

Question

問題如題。延遲載入進controller檔案後，controller提示不存在。

貼代碼：

state:

//state
$stateProvider.state('user.performance', {
                url: '/performances',
                views: {
                    '': {
                        controller: 'PerformanceCtrl',
                        templateUrl: 'tpl/user/performance'
                    }
                },
                resolve:{
                  loadPerformanceCtrl: ["$ocLazyLoad", function ($ocLazyLoad) {
                      return $ocLazyLoad.load('/app/performance/performance.js');//js文件有成功加载进来
                  }]
                }
            })

performance.js

;(function () {
    'use strict';
     myApp.controller('PerformanceCtrl', [
            '$scope',
            'PerformanceService',
            function ($scope, PerformanceService) {
                console.log('PerformanceCtrl');
                //...
        ])
   })();
// myApp 在此前加载的js中已经定义过。var myApp = angular.module('zwb', []);

報錯誤： Argument 'PerformanceCtrl' is not a

Answer 1

我搗鼓了下，發現：

• 當我創建一個新的module時，$ocLazyLoad.load()加載進來的component registered成功，如下

angular.module('testtest', []).controller('PerformanceCtrl', [
    //...
])

• 由上邊，我想到angular的另一個點，當module不帶參時是getter，所以嘗試如下：

angular.module('order').controller('PerformanceCtrl', [
    //...
])

ocLazyLoad debug 提示ocLazyLoad.moduleReloaded order,這樣perfomance下的component被load進來，register也成功。

糾結了蠻久，對angular的理解以及引入組件的熟悉度還很不夠。感謝 G_Koala_C 的回答，thank you~

Answer 2

路由的resolve通常是預先載入目前state用到的數據，資料載入完了之後再去載入頁面。你這個狀況，沒有必要懶加載呀，完全是畫蛇添足嗎。搞不清楚你這個錯誤在哪裡，大概兩種：
1，去掉懶加載，沒什麼用。
2，將views中的controller改成loadPerformanceCtrl，resolve已經直接重新命名了。不確定好不好使。