Question

我在Angular 4.0.0 SPA中有一些导航链接，只有它们上的查询字符串不同。我是这样构建的：

  <!-- MONTH -->
  <li class="right">
    <a [routerLink]="[]" [class.active]="insights.interval===2" queryParamsHandling="merge" [queryParams]="{range: 'MONTH'}">
      <span>M<strong>MONTH</strong></span>
    </a>
  </li>

  <!-- WEEK -->
  <li class="right">
    <a [routerLink]="[]" [class.active]="insights.interval===1" queryParamsHandling="merge" [queryParams]="{range: 'WEEK'}">
      <span>W<strong>WEEK</strong></span>
    </a>
  </li>

如果我将鼠标悬停在这些链接上，它们看起来是正确的：

/insights/brand/5889cdfea7eb8f0e7c56bc9f?range=MONTH
/insights/brand/5889cdfea7eb8f0e7c56bc9f?range=WEEK

但是当我点击它们时，没有任何反应。未达到组件中设置的断点。

如何调试路由器并弄清楚为什么没有发生？

我在这里什么也没有通过，这没关系吗？

[routerLink]="[]"

这是路由，以防万一：

@NgModule({
  imports: [
    RouterModule.forChild([
      {
        path: 'insights',
        component: InsightsComponent,
        canActivate: [User],
        children: [
          {
            path: 'brand/:id',
            component: InsightsBrandComponent
          },
          {
            path: 'brand-item/:id',
            component: InsightsBrandItemComponent
          },
          {
            path: 'item/:id',
            component: InsightsItemComponent
          },
          {
            path: 'venue/:id',
            component: InsightsVenueComponent
          }
        ]
      }
    ])
  ],
  exports: [RouterModule]
})
export class InsightsRoutingModule { }

[编辑]

这是路由器调试：

Answer 1

您可以通过一种方式查看路由发生的情况是打开路由跟踪。我在这里有一个例子：https://github.com/DeborahK/Angular-Routing

    RouterModule.forRoot([
        { path: 'welcome', component: WelcomeComponent },
        { path: '', redirectTo: 'welcome', pathMatch: 'full' },
        { path: '**', component: PageNotFoundComponent }
    ], { enableTracing: true })

当我点击使用routerLink和queryParams构建的链接时，为什么没有发生任何事情？

1 个答案: