Angular2 [routerLink] 有效，this.router.navigate 似乎使应用程序崩溃

Question

我在 Angular2 应用程序中遇到路由问题，在该应用程序中使用这样的按钮工作正常：

<button [routerLink]="['/home/maincomponent']>Click</button>

但是在函数中使用相同的路由失败了 - 页面似乎加载了一瞬间，然后应用程序完全刷新并将我返回到主页/根页面，但控制台上没有错误。

goToComponent() {
    this.router.navigate(['/home/maincomponent']); 
}

此外，只需在浏览器中输入路径即可导航到该路线，可以正常加载组件，没有任何错误或重定向。

http://localhost:4000/#/home/component

路由器配置：

const routes: Routes = [
  {
    path: 'home', 
    component: HomeComponent,
    children: [{ 
      path: '', 
          redirectTo: 'dashboard',
          pathMatch: 'full'
        },
      { 
      path: 'dashboard', 
          component: DashboardComponent
        },
      {
      path: 'search', 
          component: SearchComponent
        },
      {
      path: 'maincomponent', 
          component: MainComponent
        },
      {
      path: '**', 
          component: DashboardComponent
      }]
  }
];

@NgModule 配置：

RouterModule.forRoot(routes,
{
  useHash: true,
  preloadingStrategy: PreloadAllModules
}),

Answer 1

我找错地方了。我将函数调用（单击）绑定到

<a href="" (click)="goToComponent">LINK</a>

元素，失败。

切换到

<span (click)="goToComponent">LINK</span>

元素解决问题。

Angular2 [routerLink] 有效，this.router.navigate 似乎使应用程序崩溃

Angular2 [routerLink] works, this.router.navigate seems to crash the app

routes

routerlink

angular