AngularJS中的實時更新

爲了學習Angular & Codeigniter我已經擴展了最初的新教程（來自CI）。在當前階段，它會自動顯示新帖子&從頁面&中刪除已刪除的帖子當然會更新模型/數據庫。 - 我認爲我沒有爲AngularJS做這個最有效的方法。對我的代碼的反饋會對此有所幫助。 -AngularJS中的實時更新

不過，我主要關心的是如何在Angular中做差異更新？ 當我通過jQuery完成這項工作時，我只需將一個時間戳添加到我的ajax url。然後我會在控制器中抓取那個時間&將它分配給一個變量&做一個比較來拉任何額外的帖子。它效果很好。它只會吸引新的故事（如果它們存在的話），如果它們不存在，則不會有太多的開銷。

但是，目前在Angular中，它將每個請求（每5秒）拉動整個JSON數據 - 對於大型應用程序，這會消耗過多的帶寬。我怎樣才能區分這一點，只提取新帖子？

controllers.js（角控制器）

var timestamp = ''; 
function NewsListCtrl($scope, $http, $timeout) { 

$scope.newsRequest = function(){ 
    $http.get('/ci/index.php/news/get_news_ajax/' + timestamp).success(function(data) { 
     timestamp = $.now(); 
     $scope.news = data; 
    }); 
}; 
$scope.newsRequest(); 
setInterval(function(){ 
    $scope.$apply(function(){ 
      $scope.newsRequest(); 
    }); 
}, 5000); 

}

上面的代碼（根據笨第三）成功通過一次進URL的第三分段。最初加載頁面時，將顯示所有帖子。然後在newsRequest（）再次觸發後，我得到一個空白頁面。我假設因爲沒有更新的帖子，它將空數組賦給我的$ scope.news。 我該如何解決這個問題，以便追加更新的帖子？

（就像我說的，我想我不會趁着AngularJS NG-重複，以最充分的。如果有人有更好的解決辦法，請賜教！）

來源

2013-03-15 EnigmaRM

我最終讓事情按照我需要的方式工作。我的邏輯有一個巨大的缺陷。在我上面的代碼中，我一直試圖在當前時間$ .now（）中傳遞，但爲了擁有有效的邏輯，我需要在最後一篇文章的時間傳遞。這樣，我可以比較是否有任何帖子是在我拉出的最後一個帖子後創建的。

var timestamp = ''; 
function NewsListCtrl($scope, $http, $timeout) { 
    $scope.news = []; 
    $scope.newsRequest = function(){ 
     $http.get('/ci/index.php/news/get_news_ajax/' + timestamp).success(function(data) { 
      $scope.news = data.recent.concat($scope.news); 
      if (data.recent[0] != null){ 
       timestamp = data.recent[0].time; 
      } 
     }); 
    }; 
$scope.newsRequest(); 
setInterval(function(){ 
    $scope.$apply(function(){ 
      $scope.newsRequest(); 
    }); 
}, 5000);

的另一個大問題是，我數據對象中，我有一個數組裏面。所以我需要訪問該數組中的東西。在我看來，我已經得到了一些補償，但那只是有點草率。讓我的Angular Controller處理它會更乾淨。

東西要指出的是這行代碼：

$scope.news = data.recent.concat($scope.news);

後第一個得到它的工作，我最初concating data.recent至$ scope.news末。但是這樣做會將新項目顯示在視圖的末尾 - 而不是頂部。這是一個簡單的修復，通過將$ scope.news連接到我的新對象/數組來獲得它追加到頂端。

來源

2013-03-19 20:17:37 EnigmaRM

您需要Concat的加載的數據到$ scope.news。如果它是一個數組 - 容易

$scope.news.concat(data);

否則，您可能需要遍歷加載的數據並添加新位。

來源

2013-03-15 20:59:27 sparkalow

好主意。但我無法正確執行它。按照您列出的方式進行操作會給我一個錯誤，說明_ $ scope.news是undefined_。我將如何正確實施？ – EnigmaRM 2013-03-15 21:19:08

AngularJS中的實時更新

回答

相關問題