Angular 4 路由器在刷新页面时丢失参数

Question

当我使用路由器链接时，路由器会找到页面并呈现它 但是当我尝试刷新页面或从 url 重新输入时，它会失败并给我这个错误：

错误：无法匹配任何路由。 URL 段：“项目”

在这里提问之前我已经搜索了很多，但找不到答案。

我正在使用的链接： http://localhost:4200/#/project/5

这是我的路由器配置：

export const routes: Routes = [
    { path: '', component: UserHomepageComponent },
    { path: 'signin', component: SigninComponent },
    { path: 'signup', component: SignupComponent },
    { path: 'userHomepage', component: UserHomepageComponent },
    { path: 'project/:project', component: ProjectComponent }
];

有效的链接：

<div [routerLink]="['/project/', project.id ]" class="project" *ngFor="let project of projects">
    <div class="project-name">{{project.id}} - {{project.description}}</div>
</div>

有什么想法吗？

Answer 1

你的代码应该只是

<div [routerLink]="['/project', project.id ]" class="project" *ngFor="let project of projects"> <div class="project-name">{{project.id}} - {{project.description}}</div> </div>

我还看到你的路径中有#，所以当你刷新它时可能找不到匹配的路线！

在没有这些的情况下更改您的 app.module，

{provide: LocationStrategy, useClass: HashLocationStrategy}