在Angular中路由到子组件

Question

我尝试从父组件导航到其子组件。我的路由模块看起来像

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { GroupComponent } from './group/group.component';
import { GroupDetailComponent } from './group-detail/group-detail.component';

const routes: Routes = [
  {
    path: '',
    component: FocalComponent,
    canActivate: [ProjectTeamGuard || BhrGuard || ManagerGuard]
  },
  {
    path: 'my-group',
    component: GroupComponent,
    children: [
      {
        path: 'group-detail',
        component: GroupDetailComponent
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

我的父组件正在执行以下功能

  public goToGroupDetail() {
    this.router.navigate(["./group-detail"], { relativeTo: this.activeRoute });
  }

我收到了下一个错误

  

错误错误：未捕获（承诺）：错误：找不到主要插座   加载＆＃39; GroupDetailComponent＆＃39;错误：无法找到主要插座   加载＆＃39; GroupDetailComponent

我不确定它是否与函数routing.module本身的goToGroupDetail()有关。

提前致谢。