当使用Angular路由器的navigate
方法时,如果不发生重定向到目标页面,可能是由于以下几个原因:
// app-routing.module.ts
const routes: Routes = [
{ path: 'home', component: HomeComponent },
{ path: 'about', component: AboutComponent }
];
navigate
方法接受一个路由路径的数组参数,可以包含路由参数。// app.component.ts
import { Router } from '@angular/router';
constructor(private router: Router) {}
navigateToAboutPage() {
this.router.navigate(['/about']); // or with parameters: this.router.navigate(['/about', 1]);
}
:确保在父组件中有一个
标签,用于渲染目标页面的内容。
RouterModule
。// app.module.ts
import { RouterModule } from '@angular/router';
@NgModule({
imports: [
RouterModule.forRoot(appRoutes)
]
})
export class AppModule { }
// about.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AboutComponent } from './about.component';
@NgModule({
imports: [
RouterModule.forChild([
{ path: '', component: AboutComponent }
])
],
declarations: [AboutComponent]
})
export class AboutModule { }
通过检查这些问题,可以解决navigate
方法不重定向到目标页面的问题。