我創建了一個使用REST API檢索產品列表和許多其他功能的Angular 2應用程序。組件和http請求上的Angular 2 Loader
我想實現一種裝載機的方式有兩種：
爲每個組件加載網頁時加載，例如，當您加載產品分類頁面，你會看到一個微調通過覆蓋，直到http請求和渲染完成。
同樣的事情，當你點擊例如「添加到購物車」我想創建一個覆蓋產品列，禁用幾秒鐘再次點擊添加到購物車按鈕，直到產品被添加到購物車。
我該怎麼做？
提前致謝！
當以簡單的方式加載頁面時，您可以爲每個組件添加加載程序。只需在組件標籤中添加一個加載器gif即可。當組件從REST-API中收集數據時，它將被組件中的數據替換。
例如：<mycomponent><img src="spinner.gif"></mycomponent>
對於第二部分， 「加入購物車」。您應該能夠使用疊加層向產品列添加css-class，當您點擊「添加到購物車」時觸發。 調用API並添加產品，在HTTP observable的訂閱中，您可以設置在操作完成時調用的「回調」方法，在您的情況下關閉覆蓋。
我在網上創建了一種解決方案。
那就是：https://www.npmjs.com/package/angular2-busy
而我能夠管理一個http請求裝載機。
它很容易使用，您可以在Promises和Observable的訂閱中應用此「忙碌」加載器。
希望它有幫助。
嘿！感謝您及時的回覆。不幸的是，這並不適用於我，我已經將
添加到我之前解釋過的組件標籤中，但是我沒有看到加載程序映像並且內容是正常加載的。 –
FreshHaze
這聽起來很奇怪，應該工作。是因爲內容加載速度如此之快？ – user1570634
我不這麼認爲。我也嘗試過一個組件，需要2-3秒的負載，但如果我插入組件的標籤之間的圖像我無法看到微調，如果我把它放在標籤之外，我看到微調器，但它當然不會在組件加載後消失。 – FreshHaze