如何使用 workin routerlink 将组件正确添加到我的 Jhipster + Angular 项目中？

Question

所以我在 jhipster 上生成了一个新的应用程序，我想为我的门户网站创建一个前端常见问题页面，我将它创建为一个实体，它生成了所有的 CRUD 组件（详细信息、删除、编辑）。 这当然在 jhipster 模板中看起来像一个管理员/用户视图表，带有用于查看、编辑或删除的按钮。 我想在不需要拥有帐户的情况下向网站访问者公开常见问题解答...所以我生成了一个组件“常见问题页面”，如文档所述： https : //www.jhipster.tech/using-angular/唯一的问题是 routerlink 不会将我重定向到“/faq”，而是将我重定向到 404 页面。 我根据现有的“主页”创建了“常见问题页面”组件，如下所示：

• faq-page.component.html（现在只有一些文本）

• 常见问题页面.component.ts

   import { Component, OnInit } from '@angular/core'; @Component({ selector: 'jhi-faq-page', templateUrl: './faq-page.component.html', styleUrls: ['./faq-page.component.scss'] }) export class FaqPageComponent implements OnInit { constructor() { } ngOnInit() { } }

• 常见问题页面.module.ts

 import { NgModule } from '@angular/core'; import { RouterModule } from '@angular/router'; import { TestAppSharedModule } from 'app/shared/shared.module'; import { FAQ_PAGE_ROUTE } from './faq-page.route'; import { FaqPageComponent } from './faq-page.component' @NgModule({ imports: [RouterModule.forChild([FAQ_PAGE_ROUTE]), TestAppSharedModule ], declarations: [FaqPageComponent] }) export class FaqModule { }

• 常见问题页面.route.ts

 import { Route } from '@angular/router'; import { FaqPageComponent } from './faq-page.component'; export const FAQ_PAGE_ROUTE: Route = { path: 'faq', component: FaqPageComponent, data: { authorities: [], pageTitle: 'faq-page.title' } };

Answer 1

检查您的 app-routing.module.ts 并确保...LAYOUT_ROUTES,行最后！ ng generate将在最后添加您的新组件，这将使全能 404 页面（包含在 LAYOUT_ROUTES 中）在您的新页面之前匹配。 这需要用大型友好字母打印在某处。