2017-02-13 88 views
4

我有一個ngFor有大量的元素被渲染,我想顯示一個微調,而物品不僅加載,但也渲染。Angular2 spinner for ngFor

我知道如何從服務器加載項目(即observables)時顯示微調器,但在我的情況下只需要一點時間。我可以看到,大部分時間都是由瀏覽器渲染所有ngFor元素,我不知道如何確保微調器仍然顯示在這個過程中。我嘗試了ngAfterViewChecked生命週期掛鉤,但是在ngFor完成之前也會觸發這個掛鉤。

所以我不知道有什麼辦法可以掛鉤到這個過程嗎?或者,我們可以強制Angular2 /瀏覽器增量顯示ngFor項目?即顯示正在渲染的項目,而是在創建模板後立即顯示所有項目。

我正在使用Angular 2.0.0。任何幫助讚賞。

回答

0

我還沒有演示,但想分享方向我正在尋找解決方案 - 它可能有助於任何人絆倒這個問題。

服務器端渲染使用Angular Universal。由於我的應用程序非常複雜,我將動態地在Web服務器上爲每個請求重新呈現應用程序。因此我想想象在Angular Universal的上下文中運行我的應用程序代碼爲每個請求。

不幸的是,Angular Universal Overview美國

角通用始建用Node.js的 後端工作。有適用於大多數流行的node.js服務器端的適配器,如Express或Hapi.js框架。但是,除了node.js, ,Angular Universal還支持ASP.NET Core。在接近 未來,我們希望增加對Java,PHP和Python的支持。

但是,Google的報價爲Node.js on their Cloud Platform。所以現在我正考慮在雲中使用Node.js,然後使用Angular Universal來在服務器端渲染我的應用程序。

看來我不考慮角通用App Engine上唯一的人:Angular4 serverside-rendering on google-app-engine standard

另一個潛在的有用資源:Server-Side Rendering in Angular 2 with Angular Universal