如何從控制器更新集合數組中的模型

我知道Angular自然而然地允許用戶交互來更新模型。事實上，關於它的許多問題已經在SO，here's one of those questions上。如何從控制器更新集合數組中的模型

在這種情況下，用戶必須通過視圖與模型進行交互。

但是，我怎樣才能修改集合中的模型，作爲控制器編程的結果？比如說......我可以說我正在用某個與每個加載器關聯的唯一進度編號構建某種加載器。當用戶開始加載時，加載事件被添加到過去的加載事件的集合中。現在，我想通過ajax對loader.progress進行一些更新。

所以認爲會顯示這樣的事情：

Loading Assets: 
===================================== 
Loader 1 ------------ 53% 
Loader 2 ------------------------ 91% 
Loader 3 -- 9% 
Loader 4 --------- 43%

和模型的集合是這樣的：

$scope.loaders = [ 
    { asset: "somePicture.jpg", progress: 53 }, 
    { asset: "movie.mov", progress: 91 }, 
    { asset: "someProgram.torrent", progress: 9 }, 
    { asset: "etc.txt", progress: 43 } 
];

，當我第一次開始一個新的Loader，我想補充它以這種方式收集：

$scope.loaders.push({ asset: "reallyCoolSong.mp3", progress: 0 });

當然，下一步將更新reallyCoolSong.mp3 ajax函數完成後的進度。

我該怎麼做？

來源

2014-02-19 Kristian

我想你可能會在你的腦袋複雜的事情。您只需更新要在視圖中更新的對象的屬性，並且它將自動使視圖刷新綁定到該屬性的任何位置。所以你描述的只是工作。如果您使用$ http角度將通過調用apply自動標記爲摘要循環。如果你正在做異步的角度服務以外的事情，你可以直接調用$ scope。$ apply（）。 – shaunhusain

但是從字面上看我沒有辦法從視圖中更新......用戶並沒有「更新」下載進度......下載本身正在被ajax更新。因此，從控制器中，我需要維護'$ scope.loaders'中某個模型的數組索引，然後通過說'$ scope.loaders [index] .progress = 12'來更新它。 – Kristian

您不需要從視圖更新。你嘗試過你的解決方案嗎？對我來說這似乎是正確的方式。您的ajax響應會觸發一個更新加載器進度的函數。由於沒有用戶交互，您可能需要使用$ scope。$ apply – pedalpete

在線只是保持與面向對象，你可以有在工廠加載條對象。它使用一個像$ http或$ .ajax這樣的服務來更新自身的方法，而不需要跟蹤索引。如果您使用$.ajax就知道你會需要使用

if(!$rootScope.$$phase)$rootScope.$apply()

法斷火從$.ajax的XHR進度事件摘要週期。或者，也許你已經有了一個機制。

這裏是一個plunker與一般的想法

來源

2014-02-19 20:20:19 calebboyd

我設置了一個演示，你應該可以建立...我只是使用$超時來簡化事情，但這可能是你更新基於AJAX調用進度的地方。

// Code goes here 

angular.module("myApp",["ui.bootstrap"]).directive("progressLoader", function($timeout){ 
    return { 
    restrict: "E", 
    scope: {file:"@"}, 
    link: function(scope, element, attrs){ 
     scope.progress = 0; 
     function updateProgress(){ 
     scope.progress++; 
     if(scope.progress<100) 
      $timeout(updateProgress,100); 
     } 
     updateProgress(); 

    }, 
    template: "<div>{{file}}</div><progressbar value=\"progress\"></progressbar>" 
    } 
});

http://plnkr.co/edit/f2FBBiMYtA6YU46uKbvb?p=preview

來源

2014-02-19 19:34:44 shaunhusain

如何從控制器更新集合數組中的模型

回答

相關問題