角度-网址已更改，但视图未加载

这是我的 app-routing-module.ts

const routes: Routes = [
    {
        path: '',
        component: LayoutComponent,
        children: [
            {
                path: 'parent',
                component: ParentComponent,
                children: [
                    { path: ':id/:name', component: ChildComponent }
                ]
            }
        ]
    },
];

我编写了一个函数来检查URL是否在中使用静态值parent.component.ts。

goToChild() {
   this.router.navigate(['1/john'], { relativeTo: this.route });
}

我在中调用该函数parent.component.html。

<button class="btn btn-primary" (click)="goToChild()">Search</button>

当我点击按钮时，我会在地址栏中看到正确的网址，

 localhost:3000/parent/1/john

但是视图永远不会加载，而是停留在上parent.component.html。我是Angular的新手，正在使用版本5。

如果我有这样的路线，那就可以了。

const routes: Routes = [
    {
        path: '',
        component: LayoutComponent,
        children: [
            {
                path: 'parent',
                component: ParentComponent
            },
            {
                path: 'parent/:id/:name', component: ChildComponent
            }
        ]
    },
];

将ChildComponent路线放在的子级数组下对我来说更合适ParentComponent，但是在我这样做时。仅URL更改，视图不更改。

任何帮助都感激不尽。