如何显示在角4

子组件加载文字在我的“event.component”我有一个子组件（APP-GROUPLIST）如何显示在角4

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

在页面初始加载，子组件不显示立即。我想要做的是，在子组件尚未显示的同时显示“加载组...”文本。

来源

2017-09-04 Carl Sare

你可以显示“子组件未立即显示”的原因吗？ – Pengyy

由于此子组件从API服务加载数据。 –

您可以使用，如果在模板/ else逻辑与ngIf像：

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

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

对于这个工作，你需要设置一个知道当孩子准备好显示变量，称为childrenReady在这个例子中。这将显示应用程序组列表，如果这是真的，但内容在“＃加载模板，如果没有。

你也可以在子组件而不是容器中做这个逻辑，如果容器没有/可以“知道孩子的状况。

来源

2017-09-04 03:23:51 bryan60

在你的子组件。你可以使用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>

不要忘记在您的子组件typescript代码中添加变量加载：布尔值。

来源

2017-09-04 04:14:37

如何显示在角4

回答

相关问题