时间戳

首页 > 解决方案 > 角度命名的路由器插座不显示组件

angular - 角度命名的路由器插座不显示组件

问题描述

我正在尝试component在我的主路由器插座内的命名插座内显示一个。我有一个组件： ，其中calculateur.component.ts有一个：buttonrouter link

[routerLink]="['/',{ outlets: { resultats: 'synthese' } }]"

这是路由配置：

{

path: "indicateur",

    component: IndicateurComponent,
    children: [
      {
        path: "",
        redirectTo: "absenteisme",
        pathMatch: "prefix"
      },
        path: "calculateur",
        component: CalculateurComponent,
        children: [
          {
            path: "synthese",
            component: SyntheseComponent,
            outlet: "resultats"
          },
          {
            path: "cout-direct",
            component: CoutDirectComponent,
            outlet: "resultats"
          },
          {
            path: "cout-indirect",
            component: CoutIndirectComponent,
            outlet: "resultats"
          }
        ]
      },

当我点击它时，网址变成 : http://localhost:4200/#/indicateur/calculateur(resultats:synthese)，但屏幕上什么也没有发生。

我不确定导致上述行为的问题。

标签： angular

解决方案

routerLink应该在您的IndicateurComponent模板上（您可能将其命名为indicateur.component.html），而不是在CalculateurComponent.

另外，请确保将您router-outlet的IndicateurComponent.

推荐阅读