angular 2显示基本组件中定义的路由器出口中内部子组件的html内容

我正在开发示例应用程序，并且有不同的组件和子组件

以下是在应用程序中配置路由的方式

Mainroute.ts：

export const routes: Routes = [   
    { path: '', redirectTo:'HomePage', pathMatch:'full' },   
    {
        path: 'HomePage', component: HomeComponent,
        children: [

            {
                path: 'component1-path', component: component1
                children: [
                    { path: 'component-innerchild1-path', component: component-child1},
                    { path: 'component-innerchild2-path', component: component-child2},
                    { path: 'component-innerchild3-path', component: component-child3}
                ]
            },

            { path: 'component2-child-path', component: component2},
            { path: 'component3-child-path', component: component3}
        ]
    },      
    { path: 'component3-path', component: component3},
    { path: '*', component: HomeComponent }
];

HomeComponent.ts：

This is Home page component
<a routerLink="component1-path">child component</a>
<router-outlet></router-outlet>

当我运行页面时，我能够在component1page.html页面中定义的routeroutlet中显示“Component-child1page.html”的内容。 我想在“HomeComponent”html页面中单击“Component-child1page.html”时显示它的内容。是否可以在另一个routeroutlet中显示内容

我尝试过的： 我尝试在主页html页面中为routeroutlet提供name属性

<router-outlet name="displayinnerchild"></router-outlet>

查看了下面的链接，但没有找到太多帮助

---

任何帮助都将不胜感激。

如果您想在主页的路由器出口中显示它，为什么它是组件1的子路由？让它成为回家路线的孩子。就这么简单。是不是

路由器插座

而不是

路由器插座

？谢谢@Chrillewoodz，更新了question@JBNizet，应用程序导航为首页->组件1->组件子级。我不想在component1路由器出口中显示数据，而是想在主页路由器出口中显示数据。我看不出导航与此有什么关系。没有任何东西阻止您将链接添加到指向任何其他路由的任何路由中。

this is component1's inner child

<router-outlet name="displayinnerchild"></router-outlet>

{ path: 'component-innerchild1-path', component: component-child1, outlet: 'displayinnerchild'},