Angular 从子管线添加到父模板

Angular 从子管线添加到父模板,angular,Angular,假设我正在创建一个购物网站。我想在主模板标题中显示购物车。购物车只应显示在购物页面中,而不应显示在其他页面中。例如,付款页面不应该有那个 现在我找不到如何从子组件内部向主模板(在本例中为购物车)注入内容。换句话说,我应该如何在主模板中创建占位符,并从子模板填充它 app component -> <router-outlet /> route: /shopping-page -> <cart /><router-outlet /> child

假设我正在创建一个购物网站。我想在主模板标题中显示购物车。购物车只应显示在购物页面中,而不应显示在其他页面中。例如,付款页面不应该有那个

现在我找不到如何从子组件内部向主模板(在本例中为购物车)注入内容。换句话说,我应该如何在主模板中创建占位符,并从子模板填充它
app component -> <router-outlet />

route: /shopping-page -> <cart /><router-outlet />
  child routes: /shopping-page/:item -> <child-content />

route: /payment-page -> <payment-content />
路线:/shopping页面-> 子路线:/shopping page/:item-> 路线:/payment页面-> 按照上面的结构,为包含公共组件和路由器出口的公共组件的页面创建包装器组件路由,并将所有页面声明为该路由的子级,并且仅使用非公共内容填充这些模板

然后在不需要公共组件的页面的路由中粘贴任何您想要的内容


您没有从子级填充主内容,模板只是适当地嵌套了。

但是您看到它们不是完全嵌套的。购物车是页眉中的一小部分,位于正文中。实际屏幕位置与此无关,您可以在此嵌套结构中构造模板,以提供所需的公共组件。然后根据需要使用CSS/HTML进行定位。