angular – 错误：无法找到插入myteam_outlet以加载’MemberList

发布时间：2020-12-17 17:09:13 所属栏目：安全来源：网络整理

导读：我已经尝试了所有解决方案,但没有运气.我的情况有所不同. 在主要组件中,我有一个装载子模块的插座.我在子模块中定义了子路由： RouterModule.forChild([ { path: '',component: MyTeamComponent },{ path: 'members',component: MemberListingComponent,outl

我已经尝试了所有解决方案,但没有运气.我的情况有所不同.

在主要组件中,我有一个装载子模块的插座.我在子模块中定义了子路由：

RouterModule.forChild([
  { path: '',component: MyTeamComponent },{ path: 'members',component: MemberListingComponent,outlet: 'myteam_outlet'}
])

默认路径{path：”,组件：MyTeamComponent}在html下面：

<div class="col-md-2 row">
  <md-toolbar color="primary">
    <md-toolbar-row>
      <a md-button [routerLink]="[{ outlets: { myteam_outlet: ['members'] } }]"
      [routerLinkActive]="['router-link-active']">Members Listing</a>
    </md-toolbar-row>

    <md-toolbar-row>
      <a md-button>Attendance</a>
    </md-toolbar-row>
  </md-toolbar>
</div>

<div class="col-md-10">
  <router-outlet name="myteam_outlet"></router-outlet>
</div>

在上面的HTML中你可以看到我有一个名为outlet.这里我想在< a md-button [routerLink] =“[{outlets：{myteam_outlet：['members']}}]”[routerLinkActive] =“['router-link-active']”>时加载MemberListingComponent ;会员列表< / a>单击,但不断收到错误.

解决方法

等待答案并在谷歌上搜索.我已经解决了我的问题.

我正在使用子插座并尝试加载子组件,但路由与路由器插座不在同一级别.路由应该是：

RouterModule.forChild([
  {
    path: '',component: MyTeamComponent,children: [
      { path: 'members',component: MemberListingComponent }
    ]
  }
])

(路由和路由器出口现在在同一水平)

现在它会找到我的子插座并在其中加载组件如果我这样做.router.navigate([‘myteam / members’]);.也不需要命名路由器插座.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!