如何从控制器更新集合数组中的模型

我知道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

如何从控制器更新集合数组中的模型

回答

相关问题