我正在尝试修改现有的 Angular 应用程序以适应此 Starter Project 的结构.不管怎样，我的应用程序模块有一个子模块(教程)。看起来像这样:
当登陆根域然后使用路由器链接导航到 http://localhost:3000/tutorial/chapter/0 ，一切正常。但是，如果我刷新页面或尝试直接转到该链接，则会出现错误:
Unhandled Promise rejection: Template parse errors:
'my-app' is not a known element:
1. If 'my-app' is an Angular component, then verify that it is part of this module.
2. If 'my-app' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message. ("
<body>
[ERROR ->]<my-app>
<div class="valign-wrapper">
<div class="preloader-wrapper active valign"): a@30:4 ; Zone: <root> ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse
所以我相信这会发生，因为不是链接到应用程序组件的 url，教程子模块作为子模块，它只是链接到 TutorialModule，然后是 <my-app></my-app>。来自 index.html 的标签不被认可。这以前有效，所以我不确定这个新配置的哪个方面打破了这个。
这是我的 app.routes.ts :
import { homeComponent } from './components/home/home.component';
import { pluginsComponent } from './components/plugins/plugins.component';
import { Routes, RouterModule } from '@angular/router';
const appRoutes: Routes = [
{ path: '', component: homeComponent },
{ path: 'tutorial', loadChildren: 'tutorial/tutorial.module', pathMatch: 'prefix'},
{ path: 'plugins', component: pluginsComponent }
];
export const appRoutingProviders: any[] = [];
export const routing = RouterModule.forRoot(appRoutes);
和我的 tutorial.routes.ts :
import { Routes, RouterModule } from '@angular/router';
import { tutorialComponent } from './tutorial.component';
import { chapterComponent } from './chapter/chapter.component';
const tutorialRoutes: Routes = [
{
path: 'tutorial',
component: tutorialComponent,
children: [
{ path: 'chapter/:id', component: chapterComponent },
{ path: '', redirectTo: 'chapter/0', pathMatch: 'full'},
]
}
];
export const tutorialRouting = RouterModule.forChild(tutorialRoutes);
终于在我的app.ts我在其中定义了我拥有的快速路线:
app.all(/^\/tutorial$/, (req, res) => {
res.redirect('/tutorial/');
});
app.use('/tutorial/', (req, res) => {
res.sendFile(resolve(__dirname, '../public/index.html'));
});
为教程组件提供 Angular 索引。
整个 repo 是 here
最佳答案
问题是 index.html 文件，我有 <base href=".">它应该在哪里<base href="/"> .我有一个错误报告 here
关于express - Angular2.0 路由器适用于组件而不是模块？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39666718/