angular - Angular无法匹配任何路线

Question

我试图了解Routing在Angular上的工作方式。
所以这是我的标题，我想转到其他页面。
my simple header

app.routing.ts:

export const appRoutes: Routes = [
    { path: '', component: HomeComponent },
    { path: 'auth', component: AuthComponent },
    { path: 'about', component: AboutComponent }
]

export const ROUTING: ModuleWithProviders = RouterModule.forRoot(appRoutes);

app.module.ts

@NgModule({
  declarations: [
   ...
  ],
  imports: [
    ...
    ROUTING
  ],
  ...
})
export class AppModule { }

app.component.html

 <router-outlet></router-outlet>

home.component.html

 <router-outlet></router-outlet>

主页<->身份验证正常

首页<->关于还可以

但是auth <->关于不起作用

我收到这种错误:

Error: Cannot match any routes. URL Segment: 'about/auth'

如我们所见，网址是auth enter code here的about/auth insead

Answer 1

似乎您在routerLink指令内使用了相对指定的相对路径，这基本上最终将提到的路由附加到当前路由，这就是为什么您在about/auth上将about转换为auth重定向的原因。要解决此问题，请使用如下所示的绝对路由。

[routerLink]="'/auth'"`
[routerLink]="'/about'"`

原因是，当您在 /指令中包含不带 routerLink的路由时，由于 relative routing的存在，它将最终将路由追加到 currentRoute。确保导航到特定路线时应使用绝对路线(在路线之前添加 /)。