使用Router的onSameUrlNavigation属性来设置导航到相同URL时的行为。默认情况下,它是ignore,这意味着导航到相同URL时不会执行任何操作。
如果要重新加载相同的页面,可以将onSameUrlNavigation设置为reload,这样每次导航到相同URL时都会重新加载页面。
代码示例:
app.module.ts:
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: '', component: HomeComponent }
];
@NgModule({
imports: [RouterModule.forRoot(routes, { onSameUrlNavigation: 'reload' })],
exports: [RouterModule]
})
export class AppRoutingModule { }
app.component.ts:
import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-root',
template: `
`
})
export class AppComponent {
constructor(private router: Router) { }
reloadPage() {
this.router.navigate(['/']);
}
}
在上面的示例中,当点击"Reload Page"按钮时,会重新导航到相同的URL,从而重新加载页面。
上一篇:Angular的router.navigate导航会导致目标组件渲染两次。
下一篇:Angular的RouteReuseStrategy与LazyLoadedModule搭配使用时,在路由到另一个模块后,MainLayout没有消失且[routerLinks]不起作用