0

在有几个部分的网站上工作：按类别排列的帖子、视频库等。我需要一个级别的 url (domain.com/page-address)。我可以获得有关page-address必须在前端加载哪个视图的信息，但是我无法很好地组织角度项目。

我设法使一切正常，但仅通过组件，在单个模块和单个路由器插座中，通过将所有路由发送到单个组件。 routes: Routes = [{apth: '**', , component: MainComponent }] 组件决定应该加载哪个组件。

/// viewType is retrieved from backend
<app-articles *ngIf="viewType == 'article_categories' || viewType == 'articles'" [viewType]='viewType'></app-articles>
<app-videos *ngIf="viewType == 'video_categories' || viewType == 'video_page'" [viewType]='viewType'></app-videos>
<app-page-not-found *ngIf="viewType == 'page-not-found'" ></app-page-not-found>

这对我来说似乎真的很糟糕，因为我不能使用 RouterLink 并且每次点击都会重新加载整个网站。

也尝试制作嵌套RouterOutlets，但无法使其工作。

你有解决方案吗？

谢谢

4

1 回答 1

0

如果我正确理解您的问题，我相信一种解决方案是在后端使用 Express Router 来处理您的路由。解释 Express 超出了 Stack Overflow 答案的范围，但 YouTube 上有大量教程。我建议 Traversy Media 的“MEAN Stack Front-to-Back”系列。它是旧的，所以它的一部分需要变通方法，但他设置路由器的工作流程是我迄今为止与 Angular 一起使用的工作流程。

您的 AppModule 将包含：

routes: Routes = [
           {path:  '/pathA', , component: ComponentA },
           {path:  '/pathB', , component: ComponentB },
           {path:  '/pathC', , component: ComponentC, canActivate:[AuthGuard] },
]

但实际路由将通过后端的 Express Router 处理。

Node有很多路由器包；Express 只是我使用的一种。

于 2020-02-17T21:04:39.433 回答