在AngularJS控制器中的惰性負載外部JavaScript

我的一些路由需要來自外部JS的功能。我不想一次加載它們，因爲這些JS只需要某些路線（例如/upload需要一些JS用於照片上傳，/photos需要另一個JS用於燈箱，/funny需要JS用於動畫材料等）。在AngularJS控制器中的惰性負載外部JavaScript

延遲加載這些外部JavaScript的最佳做法是什麼？

這些路由可以多次訪問（例如，用戶可以去/upload然後/photos然後/upload再次）

我知道要處理這樣使用路線的「決心」的方法的情況下，唯一的方法。此方法可用於定義在實例化路由控制器之前要加載的依賴項。這種方法的不同可能返回類型之一是承諾。因此，您可以使用它來異步開始加載外部JavaScript代碼，並返回一旦您的外部腳本加載就解決的承諾。

關於此的文檔可以在這裏找到：https://docs.angularjs.org/api/ngRoute/provider/$routeProvider在「何時」部分。

2012-10-22 06:58:47 alex3683

@ alex3683的回答可能是正確的AngularJS方式，但我沒有把握這個概念，所以我使用了jQuery的getScript()。因此，在CoffeeScript中：

yourModule.factory 'foo', -> 
    $.getScript 'https://script-to-load', -> 
     # whatever you want to do once the script is loaded

而只是從你的控制器調用它。由於AngularJS服務是懶惰和單身，這隻會加載腳本一次。

2012-12-23 09:18:36 wiradikusuma

除了Alex所說的，如果您將延遲加載AngularJS文件（如控制器和指令），您將不得不使用相關提供程序來註冊它們而不是模塊API。應用程序啓動後使用模塊API註冊的工件將無法提供給應用程序。例如，您可以定義一個懶惰的控制器是這樣的...

$controllerProvider.register('SomeLazyController', function($scope) 
{ 
    $scope.key = '...'; 
});

，而不是這個......

angular.module('app').controller('SomeLazyController', function($scope) 
{ 
    $scope.key = '...'; 
});

我已經寫了一篇博客文章，詳細說明這個問題，以及如何使用「解決'亞歷克斯談到的方法，在AngularJS中實現延遲加載。 http://ify.io/lazy-loading-in-angularjs/

2013-04-21 16:23:41

回答