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> 

元素解決了問題。