在AngularJS中異步加載數據的正確方法

Question

讓我們考慮以下情形：一些數據（JSON格式）需要顯示給最終用戶。 這樣做的通常方法（或者至少是我自己的方法）是使用Angular 工廠返回數據，將工廠包括在控制器中，並使用loop語句/ 指令顯示數據。

但是，數據每天都在增長（從數十個增加到數千個），並且在視圖中添加了一些精美的動畫，從而導致視圖的加載時間達到了天空。

通常，有多種加載數據的方式（例如， 延遲加載 ， $ q service ），但我想知道哪種方法更異步地最可靠地提供數據。

Answer 1

如果我正確理解了您的問題，那么您的問題是您要顯示大量數據，這可能會在兩個地方出錯：

問題1： 加載數據

為了保持快速加載，您可以使用分頁進行構建，這會將數據分成較小的頁面，以保持快速的加載時間。

問題2： $$$$$$$$$$$$

當顯示ng-repeat您的$$watchers計數可以非常迅速地增加，這會減慢你的$digest周期大幅，使您的用戶界面反應遲鈍，為了克服這一點，你可以使用的東西，使用virtualization ，如UI電網 ，這只會在屏幕上呈現部分數據，直到滾動並取消渲染視圖之外的所有內容。

Answer 2

除了Martijn Welker的答案以外，這里還有其他幾點可能會有所幫助。

1.首先，加載頁面后始終獲取大數據。 加載頁面時，您可以獲得諸如全局統計信息之類的小數據（使用解決方法，但表中的數據應始終在頁面加載后出現）。 在執行此操作時，為用戶提供表格部分的加載圖標。

2.您是否直接將數據顯示為JSON（例如JSON文件）給用戶？ 您可以通過逐步顯示數據（JSONblob.com所做的事情）來改善這一點。 它顯示了頂級鍵，單擊某個鍵后，會顯示下一個鍵。 您的后端也可以設計為可以針對不同的級別和密鑰提出不同的請求。 或者，您可以具有以下標題：

user > profile > eduction

並顯示該鍵的數據，同時使標題可單擊。您還可以存儲以前的詳細信息（小數據），以防用戶要返回。

3.嘗試使用分頁（后端或前端選擇）。 如果您不對數據及其只讀內容進行任何排序/過濾工作，則可以使用單向綁定（Angular 1.3+）將手表從列表中刪除。 即使，我也不知道顯示json :)時需要分頁。 除此之外，您可以使用plainJs創建此列表。