使用 angular 发布每个模块的划分路线

Question

所以我正在为企业客户端编写 angular 前端应用程序，我的文件结构如下：

- App (root)
  - Assets
    - CSS
    - JS (plugins, libraries, etc)
    - Images
    - Fonts
  - Common
    - Header
      -header.html
    - Sidebar, etc
  - Modules
    - HR
      - HR.module.js (the module, for this module, yeah kinda confusing)
      - HR.routes.js (the routes for this module)
      - Employees
        - EmployeesController.js (the controller for this specific peice of thsis module)
        - EmployeesRepository.js (the factory/service for this app)

到目前为止一切顺利（尽管欢迎提示）我运行遇到的问题是，如果我有两个模块（比如说 HR 和 IT），那么我的主索引页面需要利用来自两者的路由，但每页只能有一个 angular 模块。我可以将所有路由放在一个公共的 app.js 文件中，但那样会弄乱我的分离布局。有针对这个的解决方法吗？或者我应该使用更优雅的文件结构？

Edit1 - 路由

var hrModule = angular.module("hrModule", ['ngRoute', 'ngResource'])
    .config(function ($routeProvider, $locationProvider) {
        $routeProvider.when('/HR/Employees', { templateUrl: '/Modules/HR/Employees/Employees.html', controller: 'EmployeesController' });
        $locationProvider.html5Mode(true);
    });

Answer 1

这有点棘手。

您需要：

将所有模块合并到一个应用程序中，以便从一个文件完成路由（这是我在评论中的建议；这可能需要一个简单的构建系统，该系统将构建基于路由的在构建中包含的 json 个文件上）。
或者您的 window 中有多个 ng-app，每个都有自己的视图（类似于：plnkr.co/edit/wpS8LVeEc5gVPS87n5AN?p=preview）。这种方式意味着您需要一个路由系统，它根据显示的模块隐藏视图，但您可以破解此功能。

如果您正在考虑创建一个在一个文件中定义路由的小型构建系统，我这里有一个入门模板：grunt-angular template。如果你想抓取多条路线，你需要在任务中稍微修改一下。

自述文件应该涵盖了大部分内容，否则请随时给我发消息。

使用 angular 发布每个模块的划分路线

Issue dividing routes per module with angular

javascript

model-view-controller

angularjs