Angular 为什么内容投影不适用于根组件？_Angular

Angular 为什么内容投影不适用于根组件？

angular

Angular 为什么内容投影不适用于根组件？,angular,Angular,我的根组件如下所示： import { Component } from '@angular/core'; @Component({ selector: 'app-map-wrapper', styleUrls: ['./map-wrapper.component.scss'], templateUrl: './map-wrapper.component.html', }) export class MapWrapperComponent { } 并在根模块中注册：

我的根组件如下所示：

import { Component } from '@angular/core';

@Component({
    selector: 'app-map-wrapper',
    styleUrls: ['./map-wrapper.component.scss'],
    templateUrl: './map-wrapper.component.html',
})
export class MapWrapperComponent {
}

并在根模块中注册：

bootstrap: [MapWrapperComponent]

模板为：

<ng-content></ng-content>

在index.html内部，我尝试使用内容投影：

<body>
    <app-map-wrapper>
        <app-menu></app-menu>
        <app-side-bar></app-side-bar>
        <app-map-controls></app-map-controls>
        <app-bottom-right-tools></app-bottom-right-tools>
        <app-map></app-map>
    </app-map-wrapper>
</body>

因此，我在Chrome elements inspector中获得了以下信息：

<app-map-wrapper _nghost-jwi-c262="" ng-version="10.2.4"></app-map-wrapper>

您需要一个用于引导angular应用程序的组件。通常，当您使用

ngcli

创建应用程序时，该组件是现成的，它是

AppComponent

因此，

index.html

通常如下所示：

<body>
   <app-root></app-root>
</body>

您需要一个用于引导angular应用程序的组件。通常，当您使用

ngcli

创建应用程序时，该组件是现成的，它是

AppComponent

因此，

index.html

通常如下所示：

<body>
   <app-root></app-root>
</body>

我已经做过了，所以在我的根模块中有了

bootstrap:[MapWrapperComponent]

。为什么它不起作用？我刚刚在

上重命名了

，我看到内容出现在

中，然后立即消失。您是否可以创建一个stackblitz片段来复制该问题？我不能，这很难，因为我有很多依赖项，我可以共享其他代码我已经做过了，因此，我的根模块中有

bootstrap:[MapWrapperComponent]

。为什么它不起作用？我刚刚在

上重命名了

，我看到内容出现在

中，然后立即消失。您是否可以创建一个stackblitz片段来复制该问题？我不能说这很难，因为我有很多依赖项，我可以分享额外的代码，您需要将内容包装在组件中并使用路由，通常在“主”组件中，您只需标记“…加载”；）我没有任何路由，我在roto模块中有引导组件。您需要将内容包装在组件中并使用路由，通常在“主”组件中，您只需标记“…加载”；）我没有任何路由，我在roto模块中有引导组件。