Angular中this.router.navigate['/catalog']在StackBlitz无法工作的问题

你的代码里路由跳转失效的核心原因是调用Router.navigate的语法错误：

• this.router.navigate['/catalog'] 使用了方括号[]，但navigate是Angular Router提供的方法，必须用圆括号()来调用，且需传入数组形式的路由路径参数。

修正后的代码如下：

constructor(private router: Router) {}

toCompA() {
  console.log('to comp a');
  // 正确的路由跳转调用方式
  this.router.navigate(['/catalog']);
  console.log('to comp a end');
}

补充说明：Angular的Router.navigate()方法要求路由路径以数组形式传入，比如跳转到带参数的路由时，需写成this.router.navigate(['/catalog', itemId])，这样框架才能正确解析路由结构。

内容的提问来源于stack exchange，提问作者riskop