Angular2-顯示加載消息，並在異步調用完成后將其隱藏

Question

一旦來自REST API的異步調用完成后，我願意顯示/隱藏“ 正在加載”消息 ，它會隱藏“ 正在加載”消息並顯示取回的內容。

我不知道如何在Angular2中實現這一目標，但是在JavaScript中，是這樣完成的：

 <h2 id="message">Loading....</h2>
 <script>
 $(document).ready(function(){
  $('#message').hide();
   //Then Show the newly fetched content
  }
 </script>

Answer 1

我相信您正在使用ngFor來顯示獲取的數據。

這應該為您工作：

<div *ngIf="!content">Loading...</div>
<div #ngFor="#content of content"></div>
<div *ngIf="content">Now the fetched content appears here!</div>

Answer 2

<div *ngIf="!content">Loading...</div>
<div *ngIf="content"> TODO display the content here </div>