意味着大型应用的堆栈路由
我正在构build一个相当大的应用程序。 我来自PHP和jQuery，可能是，我的逻辑是错误的，请帮助我。
我想有一个自定义的模块化结构，客户端文件夹的前端和服务器的后端，分开的意见。 后端当然是build立在nodejs和mongoDb之上的，而玉石将会被帕格取代，而现在的帕格却不是很重要。
让我们这样说吧。
├── client │ ├── clients │ │ ├── directives │ │ ├── filters │ │ ├── main.js │ │ └── services │ └── tasks │ ├── directives │ ├── filters │ ├── main.js │ └── services ├── server └── views ├── clients │ ├── form.jade │ ├── index.jade │ └── list.jade ├── clients.jade ├── index.jade ├── layout.jade ├── tasks │ ├── form.jade │ ├── index.jade │ └── list.jade └── tasks.jade tasks.jade，clients.jade和index.jade将具有特定用途的ng-view和js文件。 这个想法不是加载index.jade中的所有js文件，因为我认为这会影响性能，而且会更干净。
在视图中的index.jade看起来像这样：
extends layout block body h1 HTML5 Route Example div(ng-view) script(src='lib/angular/angular.js') script(src='lib/angular-route/angular-route.js') script(src='javascripts/app.js') script(src='javascripts/services.js') script(src='javascripts/controllers.js') script(src='javascripts/filters.js') script(src='javascripts/directives.js')
意见/ contact.jade
extends layout block body h1 HTML5 Route Example - contact div(ng-view) script(src='lib/angular/angular.js') script(src='lib/angular-route/angular-route.js') script(src='javascripts/app.js') script(src='javascripts/contact/services.js') script(src='javascripts/contact/controllers.js') script(src='javascripts/contact/filters.js') script(src='javascripts/contact/directives.js')
意见/ tasks.jade
extends layout block body h1 HTML5 Route Example - contact div(ng-view) script(src='lib/angular/angular.js') script(src='lib/angular-route/angular-route.js') script(src='javascripts/app.js') script(src='javascripts/tasks/services.js') script(src='javascripts/tasks/controllers.js') script(src='javascripts/tasks/filters.js') script(src='javascripts/tasks/directives.js')
下面是我正在努力的部分：作为部分将被加载到特定页面的ng视图，我应该有redirect的路线，但这样我需要一个然后加载部分，这不是我的方式我想要。
路由波纹pipe是我使用的路由非常简化的一部分，实际上在实际应用中，它是分开的任务，客户端，… … –
app.config(function($routeProvider, $locationProvider) { $locationProvider.html5Mode(true); $routeProvider .when("/", { templateUrl: "partials/index", controller: "MainController" }) .when("/about", { templateUrl: "partials/about", controller: "AboutController" }) .when("/contacts", { templateUrl: "contacts/index", controller: "ContactsController", ... }) .when("/contacts/:id", { templateUrl: "contacts/list", controller: "ContactsController", ... }) .when("/tasks", { templateUrl: "tasks/index", controller: "TasksController", ... }) .when("/tasks/:id", { templateUrl: "tasks/list.jade", controller: "TasksController", ... }) .... .otherwise( { redirectTo: "/" }); });
如果我这样使用它，这些视图只能加载到views / index.jade，如前所述，我希望它们是分开的，所以我尝试了这种方式 – 使用redirect，这听起来并不真实我是做这件事的好方法：
app.config(function($routeProvider, $locationProvider) { $locationProvider.html5Mode(true); $routeProvider .when("/", { templateUrl: "partials/index", controller: "MainController" }) .when("/about", { templateUrl: "partials/about", controller: "AboutController" }) .when("/contacts", { redirectTo: /contacts }) .when("/contacts/:id", { templateUrl: "contacts/list", controller: "ContactsController", ... }) .when("/tasks", { templateUrl: "tasks/index", controller: "TasksController", ... }) .when("/tasks/:id", { templateUrl: "tasks/list", controller: "TasksController", ... }) .... .otherwise( { redirectTo: "/" }); });
有没有不同的方式呢？ 我尝试了不同的方式，但没有任何工作，因为我想。
请注意这是一个非常简单的介绍，我是非常新的意味着堆栈，仍然试图学习最佳实践。
更新：这个应用程序已经运行，第一个草案可以在这里看到（它不是模块化） https://github.com/tesis/meanstack
所以这是第一次使用MEAN堆栈时的一个常见问题。
这个想法是后端路由与单页面应用程序
所以当我加载www.website.com:9000/tasks你可以让你的Express在后台加载tasks.jade文件，它会的。 该页面将加载，现在您正在运行一个Angular应用程序。
一旦你在Angular应用程序中，你正在使用ngRoute ，它给你的$routeProvider能够在页面之间进行路由…实际上你正在做的是加载一个没有初始内容的单一HTML页面，你的weburl看起来像www.website.com:9000/tasks/#/所以你可以做的就是说这样做
.when("/about", { templateUrl: "partials/about", controller: "AboutController" })
这只是说当url是www.website.com:9000/tasks/#/about ，你要注入的HTML特殊的div标签（可能看起来像<ng-view></ng-view>和这个标签就是放置HTML的地方，控制器就是你想在HTML上运行的JavaScript，它允许你在两个不同的控制器中使用相同的函数名，variables等，而不必担心它们在HTML视图之间的冲突。
回到目录 – 你想加载你的clients.jade文件，你将需要“刷新”页面，因为你必须去你的Node.js Web服务，请求/请求www.website.com:9000/clients页面www.website.com:9000/clients ，它会加载整个Angular单页应用程序。 这不是在$routeProvider部分中完成的，这是一个简单的<a href='/clients'></a>或javascript的window.location('/client');
这更像是一个devise问题。 你想让用户打开一个新的页面，或让他们保持在同一页面上。 如果您select相同的页面，那么您应该在快速布局中拥有一个视图，只需在一个Angular应用程序中完成所有操作。 如果你去新的页面路线，那么你开始打破吴路由的原因，只是一堆静态网页。 这两个都不是正确的答案，它取决于你想要完成的事情
我想通了：它可以通过延迟加载来解决。