閃爍數據更新Angularjs

我有用戶的集合，這需要櫃面數據在數據庫中更改進行更新。爲此，我從控制器調用更新功能。閃爍數據更新Angularjs

在控制器

$scope.update = function(){ 
    $http.get("....") 
    .success(function(data){ 
     $scope.users = data; 
    }) 
};

模板

<div ng-repeat="user in users"> 
    ... 
</div>

事業部的閃爍會在更新功能調用被注意到。有沒有辦法避免這種情況？

來源

2015-09-21 Shyamal Parikh

'閃爍'是什麼意思？它是在最初發生，第一次加載頁面時還是每次調用更新方法時發生？ – JanS

使用[ngAnimate]（https://docs.angularjs.org/api/ng/directive/ngRepeat#animations）？ –

@JanS每當我打電話給更新函數 –

的ng-cloak指令添加到您的標記和下列CSS一起：

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { 
    display: none !important; 
}

更多信息可以在角文檔中找到 - https://docs.angularjs.org/api/ng/directive/ngCloak。

的文件指出，CSS嵌入在angular.js文件......但因爲我通常，按照最佳做法，在頁面的最後加載我的JavaScript ，閃爍仍然發生。相反，我只是將必要的CSS添加到我的網站的css文件，似乎工作。

來源

2015-09-21 18:43:36 Jason

我試過這個，但是無法讓它工作。我在某處讀到這項工作僅適用於首頁加載。 –

我有同樣的問題。正在尋找一些解決方案，而不是我的。可能這是唯一的一個。在「閃爍」的

根本原因是重建DOM，因爲您分配新，平原對象範圍：$scope.users = data;。該對象不包含Angular的跟蹤數據，因此引擎會從頭開始啓動所有內容。尤其是當你在被刷新的元素使用CSS動畫效果是惱人的 - 一切都閃爍，復位等

我怎樣才能避免呢？我沒有做$scope.data = data;，但我更新$scope.data的每一個對象，其新版本從data（在你的情況）。

查看下面的代碼。在我的情況下，我獲取新的服務器列表，然後我只應用更改。

$scope.servers = []; 

$http.get('/panel/dashboard').then(function(res) { 
    // find and upgrade servers 
    for (var n in res.data.servers) { 
     var s = res.data.servers[n]; 

     var l = get_server(s.id); // helper - get by ID from $scope.servers 
     if (l) { 
      $scope.servers.push({ 
       id: s.id, 
       name: s.name, 
       state: s.state 
      }); 
     } else { 
      // do update values only 
      l.name = s.name; 
      l.state = s.state;     
     } 
    } 

    // remember to remove old items that are in $scope.server and not in res.data 
    // then sort data 
});

我希望它有幫助。這裏最重要的不是「如何解決」，而是「理解它是如何工作的」。

來源

2016-11-04 09:44:48 MarcinC

閃爍數據更新Angularjs

回答

相關問題