如何在Angular 4中显示子组件加载文本

在我的“event.component”中，我有一个子组件（appgrouplist）

您可以在带有ngIf的模板中使用if/else逻辑，如：

<app-grouplist *ngIf="childrenReady;else loading"
    [hasStarted]="started"
    [hasEnded]="ended">
</app-grouplist>

<ng-template #loading>Loading...</ng-template>


加载。。。

要使其工作，您需要设置一个变量，该变量知道何时可以显示子项，在本例中称为childrenReady。如果这是真的，则显示应用程序组列表，如果不是，则显示“#加载模板”中的内容

如果容器不知道/不能知道子组件的状态，也可以在子组件而不是容器中执行此逻辑。
在子组件中。可以使用ng内容显示父模型。例如

父组件

<app-grouplist [hasStarted]="started" [hasEnded]="ended">Loading Groups...</app-grouplist>

<ng-content *ngIf="loading else loadedData"></ng-content>

<div *ngIf="loading" #loadedData>....elem here...</div>

正在加载组。。。

子组件

<app-grouplist [hasStarted]="started" [hasEnded]="ended">Loading Groups...</app-grouplist>

<ng-content *ngIf="loading else loadedData"></ng-content>

<div *ngIf="loading" #loadedData>....elem here...</div>


……这里是埃伦。。。

不要忘记在子组件typescript代码中添加变量加载：布尔值。
能否说明子组件未立即显示的原因

？因为此子组件从API服务加载数据。Tinalo ako ni boss amo:(