Angularjs 角度项目结构(文件夹、路线、服务等)?

Angularjs 角度项目结构(文件夹、路线、服务等)?,angularjs,Angularjs,开发大型(企业)角度web应用程序的指南应该是什么? 文件夹结构 多视图的布线 模块、配置、服务、指令、控制器和个人javascript文件 自定义过滤器、视图(html) 如果您的目录结构看起来像这样(并且您的应用程序很大),我应该像这样进行模块化吗 应用程序 controllers.js filters.js 指令.js app.js services.js index.html 我应该在我的rootmyApp模块或子模块中插入(包括)每个已安装的模块吗 angular.module

开发大型(企业)角度web应用程序的指南应该是什么?

  • 文件夹结构
  • 多视图的布线
  • 模块、配置、服务、指令、控制器和个人javascript文件
  • 自定义过滤器、视图(html)
如果您的目录结构看起来像这样(并且您的应用程序很大),我应该像这样进行模块化吗

应用程序

  • controllers.js
  • filters.js
  • 指令.js
  • app.js
  • services.js
  • index.html
我应该在我的rootmyApp模块或子模块中插入(包括)每个已安装的模块吗

angular.module('myApp',[
   'tasks',
   'documents',
   'widgets',
   'customModuleForWidgets'
]);

路由配置应该在一个地方(partent模块)还是在它自己的模块中

angular.module('myApp',[
  'ui.router'
])
  .config(['$routeProvider', '$stateProvider', function ($routeProvider, $stateProvider) {
    $stateProvider
     .state("widget-areaState", {
       url: "/widget-area",
       templateUrl: 'views/dashboard-widget.html',
       controller: 'widgetCtrl'
     });
     .state(...) // other state
     .state(...) // other state
  })
;

您可以像这样使用项目结构

您可以查看约翰·帕帕的这篇文章。它包含很多不同的东西,其中包括一个项目结构。这是一个很好的指南,可以开始一个有很多操作方法的大型角度项目。你可以自己决定每一个具体的项目,如果你想遵循与否,但大多数似乎是非常合理的。对于结构,他建议按功能文件夹:

app/
    app.module.js
    app.config.js
    components/
        calendar.directive.js
        calendar.directive.html
        user-profile.directive.js
        user-profile.directive.html
    layout/
        shell.html
        shell.controller.js
        topnav.html
        topnav.controller.js
    people/
        attendees.html
        attendees.controller.js
        people.routes.js
        speakers.html
        speakers.controller.js
        speaker-detail.html
        speaker-detail.controller.js
    services/
        data.service.js
        localstorage.service.js
        logger.service.js
        spinner.service.js
    sessions/
        sessions.html
        sessions.controller.js
        sessions.routes.js
        session-detail.html
        session-detail.controller.js
app/
    app.module.js
    app.config.js
    components/
        calendar.directive.js
        calendar.directive.html
        user-profile.directive.js
        user-profile.directive.html
    layout/
        shell.html
        shell.controller.js
        topnav.html
        topnav.controller.js
    people/
        attendees.html
        attendees.controller.js
        people.routes.js
        speakers.html
        speakers.controller.js
        speaker-detail.html
        speaker-detail.controller.js
    services/
        data.service.js
        localstorage.service.js
        logger.service.js
        spinner.service.js
    sessions/
        sessions.html
        sessions.controller.js
        sessions.routes.js
        session-detail.html
        session-detail.controller.js