Angular2微調啓動時

從許多角度2個的例子中，我們看到的index.html此代碼：Angular2微調啓動時

<app>loading</app>

這是告訴用戶該應用程序的JavaScript在這裏不是在瀏覽器中還，所以對於現在的瀏覽器只是加載這個「加載」文本

我想知道我們如何能夠改變這個文本是一個實際的微調組件。也就是說，當瀏覽器仍然加載應用程序JavaScript時如何顯示微調組件？

（最終結果的一個例子是什麼你看見當u參觀LinkedIn.com。之前看到加載的所有內容，U第一隻看到所有這些空盒子閃爍。）

2017-08-29 Marlon Ou

檢查https://stackoverflow.com/questions/35243443/pre-bootstrap-loading-screen-for-angular2 –

你可以使用一個字體令人敬畏的微調https://www.w3schools.com/icons/fontawesome_icons_spinner.asp –

你想要爲每個頁面加載微調還是隻爲着陸頁面加載？ –

我要做的就是簡單地顯示在屏幕上居中一個微調的GIF。你可以使用字體真棒微調爲@JonathanNiu提到的，或任何其他圖標/圖片真的...

<body> 
    <my-app> 
     <div class="loading-app"> 
      <img src="./public/img/spin.gif" /> 
     </div> 
    </my-app> 
</body>

和CSS類，它坐落在我的全局樣式文件：

.loading-app { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    height: 100%; 
}

2017-08-29 08:34:20

-1

有一個微調在Angular的材料中。

2017-08-29 08:18:28 Swoox

與Angular沒有加載的問題，所以它並沒有真正幫助OP。對不起，但我必須投下你的答案。 –

只需刪除加載部件，然後等待微調器在您的應用程序組件上完成。 – Swoox

不確定你的意思。 OP希望在下載JS文件的同時顯示Spinner *並且加載Angular（包括角色素材，假設OP甚至使用它）*。 –

回答