保持 angularjs 与应用程序分离

Question

>我正在计划一个应用程序，理想情况下我希望与Angular分离，因此所有dom交互都将进入Angular层，但核心业务逻辑将保存在一个完全不知道Angular的独立应用程序中。两者将通过能够向核心应用程序发送消息的 Angular 服务进行通信。

独立应用很可能会使用 requirejs 来处理依赖项注入。

我不确定的是，如何获得一个可能被声明为这样的模块：

define('AppInteractor', ['require'], function(requre){
    // Set up interactor functionality
});

变成一个角度服务。

我的第一个问题是拥有这样的适配器：

define(['AppInteractor', 'angular'], function(interactor, angular) {
    var app = angular.module('appInteractor', []).service('AppInteractor', interactor);
});

这会将 AppInteractor 注册为角度模块中的服务，这种方法的问题似乎是因为 requirejs 异步加载内容，因此在角度代码运行时尚未设置服务。它似乎也以两次角载荷结束，这可能也无济于事。

我已经看过一些文章，涵盖了通过require加载所有Angular组件，但我希望可能有更简单的方法来完成这项工作。

谁能推荐我如何做到这一点？

Answer 1

如果要在

主模块初始化后添加服务，建议将其添加到应用程序模块中

define(['AppInteractor', 'angular'], function(interactor, angular) {
  // There is no second parameter, because we are getting an existing
  // module, not creating a new one.
  var app = angular.module('appModule');
  app.service('AppInteractor', interactor);
});

否则，如果要将所有其他逻辑分组到不同的模块中，则需要导入该模块并将其添加为应用程序模块的要求。

define(['AppInteractorModule', 'angular'], function(interactorModule, angular) {
  var app = angular.module('appModule', [interactorModule.name]);
});

我还建议您使用ES6（6to5，traceur），browserify或Typescript之类的工具进行模块管理，然后编译为AMD。我发现它更容易，更清洁地开发。