Javascript 使用AngularJS作为AMD/异步加载程序？

我正在使用大型应用程序的RequireJS来管理第三方依赖关系。它动态地处理依赖关系，并在很大程度上帮助进行依赖关系管理和模块化

---

Angular可以这样做吗，或者将其与RequireJS集成是否有意义？我想根据需要延迟加载第三方或自定义依赖项（编译像RequireJS优化器这样的选项也不错）。任何建议或经验将不胜感激

我使用的是RequireJS，非常简单：

require: require.config({
paths: {
  jquery: '/assets/js/jquery',
  "jquery.bootstrap": '/assets/js/bootstrap.min',
  angular: '/js/libs/angular/angular',
  sanitize: '/js/libs/angular/angular-sanitize',
  text: '/js/libs/require/text',
  async: '/js/libs/async/async',
  moment: '/assets/js/moment.min'
},
baseUrl: '/js',
shim: {
  'angular': {'exports' : 'angular'},
  'sanitize': {'exports' : 'sanitize', deps: ['angular']},
  'jquery.bootstrap': {deps: ['jquery']},
},
priority: [
  "angular"
]
});

require(['jquery', 'angular', 'app'], function($, angular, app){
  $(document).ready(function () {
    var $html = $('html');
    angular.bootstrap($html, [app['name']]);
    $html.addClass('ng-app');
  });
});

然后在一个名为app（由第一个require语句决定）的文件中

---

将RequireJS与AngularJS结合使用是有意义的，但前提是您了解它们中的每一个在依赖项注入方面是如何工作的，因为尽管它们都注入依赖项，但它们注入的东西却非常不同

AngularJS有自己的依赖系统，可以将AngularJS模块注入到新创建的模块中，以便重用实现。假设您创建了一个实现AngularJS过滤器“greet”的“first”模块：

angular
.module（'第一'，[]））
.filter（'greet'，function（）{
返回函数（名称）{
返回“Hello”+name+“！”；
}
});

现在假设您想在另一个名为“second”的模块中使用“greet”过滤器，该模块实现了“再见”过滤器。您可以将“第一”模块注入“第二”模块：

angular
.module（'second'，['first']））
.filter（'再见'，函数（）{
返回函数（名称）{
返回“再见”+name+“！”；
}
});

问题是，为了在没有RequireJS的情况下正确工作，您必须确保在创建“第二个”AngularJS模块之前在页面上加载“第一个”AngularJS模块。引用文件：

取决于模块意味着需要加载所需的模块 在加载所需模块之前

从这个意义上说，这里是RequireJS可以帮助您的地方，因为RequireJS提供了一种干净的方法，可以将脚本注入页面，帮助您组织彼此之间的脚本依赖关系

回到“第一个”和“第二个”AngularJS模块，下面介绍如何使用RequireJS将不同文件上的模块分离，以利用脚本依赖项加载：

//firstModule.js文件
定义（['angular']，函数（angular）{
有棱角的
.module（'第一'，[]））
.filter（'greet'，function（）{
返回函数（名称）{
返回“Hello”+name+“！”；
}
});
});

//secondModule.js文件
定义（['angular'，'firstModule']，函数（angular）{
有棱角的
.module（'second'，['first']））
.filter（'再见'，函数（）{
返回函数（名称）{
返回“再见”+name+“！”；
}
});
});

您可以看到，在执行RequireJS回调的内容之前，我们需要注入“firstModule”文件，这需要加载“first”AngularJS模块来创建“second”AngularJS模块

旁注：为了在RequireJS回调函数中使用AngularJS，需要在“firstModule”和“secondModule”文件上注入“angular”作为依赖项，并且必须在RequireJS配置中将其配置为将“angular”映射到库代码。您可能也会以传统方式（脚本标记）将AngularJS加载到页面中，尽管这有损于RequireJS的优点

更多关于AngularJS core从2.0版获得RequireJS支持的详细信息，请参阅我的博客文章

---

根据我的博客文章“用AngularJS理解RequireJS”，这里是一个问题。

您是否加载角度组件，或者其他任何东西，或者两者都加载？两者都加载：角度组件、jQuery插件、自定义JS实用程序、下划线等。这确实是一个很长的问题，请参阅一些指针，还有很多。@NikosParaskevopoulos genius。我就到此为止。这个链接可能会有所帮助：我有几个关于一般延迟加载的答案。它们可能会让您对延迟加载指令等有一些了解。请参见此处的前几个结果：

define(['angular','sanitize'], function (angular, sanitize) {
    'use strict';
    return angular.module('myApp', ['ngSanitize']);
});