在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

回答