Angular 2 rc.5 的 NodeJs 路由目录答案

【问题标题】：NodeJs routing directory with Angular 2 rc.5Angular 2 rc.5 的 NodeJs 路由目录
【发布时间】：2016-12-22 11:13:47
【问题描述】：

我正在开发我的第一个 NodeJs + Angular 2 项目。在我以前的项目中，如果没有 Angular2，它使用这些路线运行得非常好。

在 NodeJs 中访问多级目录路由时出错。

例子：

它是这样工作的：

app.get('/dashboard', dashboard.getHome);        // works
app.get('/user', user.getUser);                  // works

代替：

app.get('/dashboard/home', dashboard.getHome);   // won't work
app.get('/user/home', user.getUser);             // won't work

我知道可以使用 Angular2 路由，但是否可以直接访问我在 NodeJs 中指定的静态 URL？

如果我想访问超过 1 个级别，例如：

/dashboard/tasks/42

我现在做不到，这就是我正在努力解决的问题。

app.js

var main = require('./routes/index');
var dashboard = require('./routes/dashboard');
var user = require('./routes/user');

app.get('/', main.index);

app.get('/dashboard', dashboard.getHome);        // works
// app.get('/dashboard/home', dashboard.getHome);   // won't work this way

app.get('/user', user.getUser);                  // works
// app.get('/user/home', user.getUser);             // won't work this way

仪表板/index.html

<html>
<head>
    <title>Teamo - Dashboard</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="/css/style.css">
    <!-- 1. Load libraries -->
    <!-- Polyfill(s) for older browsers -->
    <script src="javascripts/core-js/client/shim.min.js"></script>
    <script src="javascripts/zone.js/dist/zone.js"></script>
    <script src="javascripts/reflect-metadata/Reflect.js"></script>
    <script src="javascripts/systemjs/dist/system.src.js"></script>
    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.8/socket.io.min.js"></script> 
    <script>
    System.import('app/dashboard/dashboard').catch(function(err){ console.error(err); });
    </script>
</head>
<!-- 3. Display the application -->
<body>
    <my-dashboard>Loading...</my-dashboard>
</body>

即使我在 app.js 中设置了以下路由，也无法使用此 URL：

localhost:3000/dashboard/home

它返回以下错误。

错误：

GET http://localhost:3000/dashboard/javascripts/core-js/client/shim.min.js 
GET http://localhost:3000/dashboard/javascripts/zone.js/dist/zone.js 
GET http://localhost:3000/dashboard/javascripts/reflect-metadata/Reflect.js 
GET http://localhost:3000/dashboard/javascripts/systemjs/dist/system.src.js 
GET http://localhost:3000/dashboard/systemjs.config.js 
GET http://localhost:3000/dashboard/js/pace.min.js 
Uncaught ReferenceError: System is not defined(anonymous function) @ home:18
GET http://localhost:3000/dashboard/js/pace.min.js 
favicon.ico:1 GET http://localhost:3000/favicon.ico 500 (Internal Server Error)

【问题讨论】：

标签： javascript node.js angular typescript angular2-routing

【解决方案1】：

改变元素的顺序：

 app.get('/dashboard', dashboard.getHome);        // works
 app.get('/dashboard/home', dashboard.getHome);   // won't work

到：

   app.get('/dashboard/home', dashboard.getHome);   // won't work
   app.get('/dashboard', dashboard.getHome);        // works

快递对订单很敏感。

【讨论】：

抱歉，我的问题可能不清楚。我已经用更多细节编辑了我的问题。我实际上面临的问题是我无法拥有超过 1 级的路由，就像我只能使用 'localhost:3000/dashboard' 而不是 'localhost:3000/dashboard/tasks/42' 访问路由。我无法访问比 'localhost:3000/dashboard' 更深的地方。
@Danzeeeee 但是您是否尝试过更改元素的顺序以便在子目录之后设置父目录？