ngif其他重疊divs Angular4

我訂閱了一個流以從第三方API獲取一些數據，而當發生這種情況時，我會顯示一個帶有紡輪的東西。一旦我有數據，那麼這些數據就取代了這個div。我有與ngif else：ngif其他重疊divs Angular4

<div *ngIf="my-data;else loading" class="my-data-container"> 
    ... 
</div> 
<ng-template #loading> 
    <div class="loading-container"> 
     shows the loading spinning wheel  
    </div> 
</ng-template>

這個問題我已經是一段非常短的時期雙方的div出現在屏幕上，他們作出這樣一個小光點的奇效。我希望他們互相重疊，否則他們會出現在另一個之下。我可以通過代碼來實現嗎？還是需要調查css技巧？

來源

2017-10-17 Carlos Torrecillas

你如何初始化我的數據？ – Vega

我通過訂閱ngOnInit方法上的observable來實現： ngOnInit（）{this.myDataService.get（） .subscribe（g => {this.my-data = g}）; } –

將div內容移動到其他ng-template並在ngIf上添加then選項。如果你願意，我可以發佈我的建議 – Vega

確保你在開始申報my-data值null和改變ngIf語法使用容器使用then：

<div *ngIf="my-data; then #content; else loading" class="my-data-container"> 
</div> 
<ng-template #content> 
    show this content after loading 
</ng-template 
<ng-template #loading> 
    <div class="loading-container"> 
     shows the loading spinning wheel  
    </div> 
</ng-template>

來源

2017-10-17 14:00:45 Vega

爲ngif模板而不是DIV它的自我

<ng-container *ngIf="my-data;else loading"> 
    <div class="my-data-container"> 
    ... 
    </div> 
</ng-container> 
<ng-template #loading> 
    <div class="loading-container"> 
     shows the loading spinning wheel  
    </div> 
</ng-template>

來源

2017-10-17 12:42:07

ngif其他重疊divs Angular4

回答

相關問題