加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

express – Angular2.0路由器适用于组件而非模块?

发布时间:2020-12-17 07:15:06 所属栏目:安全 来源:网络整理
导读:我正在尝试修改现有的角度应用程序以适应此 Starter Project的结构.无论如何,所以我的app模块带有子模块(教程).看起来像这样: 登陆根域然后使用路由器链接导航到http:// localhost:3000 / tutorial / chapter / 0时,一切正常.但是,如果我刷新页面或尝试直
我正在尝试修改现有的角度应用程序以适应此 Starter Project的结构.无论如何,所以我的app模块带有子模块(教程).看起来像这样:

enter image description here


登陆根域然后使用路由器链接导航到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

所以我相信这种情况正在发生,因为而不是链接到app组件的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.all(/^/tutorial$/,(req,res) => {
  res.redirect('/tutorial/');
});
app.use('/tutorial/',res) => {
  res.sendFile(resolve(__dirname,'../public/index.html'));
});

为教程组件提供角度索引.

整个回购是here

解决方法

问题是index.html文件,我有< base href =“.”>应该在哪里< base href =“/”>.我有一个错误报告 here

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读