懶惰加載控制器從單獨的文件使用狀態提供者

Question

所以，我試圖動態加載一個文件，添加一個控制器到我的主模塊。問題是我不想在腳本標記中引用文件本身。

更具體地說，我有2個控制器文件。主控制器文件mainController.js在我的index.html文件中引用。我添加到該文件的任何控制器加載沒有問題。

控制器文件我想用我的登錄login.js頁面，包含以下信息：

function LoginCtrl($http){ 
    console.log("Controller loaded"); 
}; 

angular 
    .module('inspinia') 
    .controller('LoginCtrl', LoginCtrl); 

我所有的控制文件都在同一個文件夾，但是，違背了mainController.js，該login.js文件不不出現在任何.html文件中。

我的目的是加載login.js動態文件我stateProvider裏面是這樣的：

$stateProvider 
... 
.state('logins', { 
      url: "/logins", 
      templateUrl: "views/login.html", 
      controller: LoginCtrl, 
      data: { pageTitle: 'Login', specialClass: 'gray-bg' }, 
      resolve: { 

       loadPlugin: function($ocLazyLoad) { 
        return $ocLazyLoad.load ({ 
        name: 'inspinia.LoginCtrl', 
         files: ['js/controllers/login.js'] 
        }); 
       } 
      } 
     }) 
... 

只要我不嘗試動態加載login.js文件（在我們添加參考文件.html文件或在mainController.js文件中添加登錄控制器代碼）一切正常。但只要我嘗試刪除引用強制stateProvider照顧加載我得到一個Error: $injector:modulerr

任何人都知道什麼是調用lazyLoader的正確方法，所以我只能加載我的.js文件，當我需要他們？

編輯信息： 我忘了提及的東西：文件加載部分本身似乎工作。如果我不在任何地方調用控制器並只加載它。我可以看到瀏覽器正在加載控制器文件。但問題似乎是時間問題。如果我提到.state（）角度內的控制器名稱試圖在加載之前訪問它，並且在加載文件之前整個事件崩潰

Answer 1

我建議您查看ocLazyLoad以瞭解如何聲明控制器並裝載了UI的路由器解決國有產權：

https://oclazyload.readme.io/docs/with-your-router

基本上，我認爲什麼是你的方法缺失是使用串控制器聲明，而不是功能之一：

$stateProvider 
... 
.state('logins', { 
     url: '/logins', 
     templateUrl: 'views/login.html', 
     controller: 'LoginCtrl as login', 
     data: { 
      pageTitle: 'Login', 
      specialClass: 'gray-bg' 
     }, 
     resolve: { 
      loadPlugin: function($ocLazyLoad) { 
       return $ocLazyLoad.load('js/controllers/login.js'); 
      } 
     } 
    }) 
... 

一個重要的提示是：簡化之前沒有使用過的東西的第一個實現。你的例子在ocLazyLoad服務上顯示了很多參數。嘗試首先加載所需的主要元素，在成功之後逐漸添加一個元素，因爲有時您可能處於正確的軌道上，而您不瞭解的類似內容會導致您進行惡意調試常規。

而且，看看下面的例子：

https://github.com/ocombe/ocLazyLoad/tree/master/examples/complexExample

它有一個狀態宣告你的差不多。比較對方並進行修改以適應您的需求。