Angular Router，动态参数不允许上述路由工作

问题描述

我试图制作一个期望值和参数的页面，但是如果我把它放在其他路线下面（例如：登录），它将不再打开，而是打开动态路线，并且该页面必须是：www.website/动态名称 可能是什么原因导致错误？

应用程序路由

import { NgModule } from '@angular/core';
import { Routes,RouterModule,PreloadAllModules } from '@angular/router';
import { HomeComponent } from './pages/home/home.component';
...

const routes: Routes = [
  { path: '',redirectTo: '/home',pathMatch: 'full'},{ path: 'home',component: HomeComponent },{ path:'login',component: LoginComponent },//--> this one does not open login page,but instead open the below "PharmacyDetailsComponent "
  { path: ':name',component: PharmacyDetailsComponent },//--> this one opens 

但登录页面无法打开 ];

@NgModule({
  imports: [
    RouterModule.forRoot(routes,{ preloadingStrategy: PreloadAllModules,enableTracing: false,useHash: true })
  ],exports: [RouterModule]
})
export class AppRoutingModule { }

调用页面

goTosupplierDetail(supplierName: string) {
        this.router.navigate([`${supplierName}`],{...});
 }

解决方法

我认为您正在尝试导航到其他页面（例如主页或登录名）上的动态页面。因此，您应该使用绝对路径。在路由路径之前添加/。

this.router.navigate([`/${supplierName}`]);

让我知道它是否有效。 否则，您可以使用相对路径。

...
constructor(private route: ActivatedRoute) {}
...
this.router.navigate([`../${supplierName}`],{ relativeTo: this.route });