当作用域对象在内部将值更改为控制器的作用域时更新UI

我在写一个简单的小文件上传器，我将输入文件放入$scope.files并通过ajax调用上传，然后成功移动$scope.files至$scope.successfulUploads目的。我想在设置值后立即显示内嵌列表successfulUploads，它与$scope.files对象一起工作，控制台显示$scope.successfulUploads，因为它应该是。如果你愿意的话，我只需要写一个可观测值。当作用域对象在内部将值更改为控制器的作用域时更新UI

这里是我的代码：

控制器

$scope.files = []; 
$scope.successfulUploads = []; 

$rootScope.$on('upload:success', function() { 
    //console.log('Controller: on `success`'); 
    for (var i = 0; i < $scope.files.length; i++) { 
     $scope.successfulUploads.push($scope.files[i]); 
    } 
    $scope.files = []; 
    console.log('successfulUploads: ' + $scope.successfulUploads); 
});

HTML：

<span class="span2 btn btn-success fileinput-button"> 
    <span>Add Files</span> 
    <input type="file" multiple ng-model="files" file-change> 
</span> 
<table class="table table-hover table-striped"> 
    <tbody> 
     <tr ng-repeat="file in successfulUploads"> 
      <td>{{file.name}}</td> 
      <!--<td><a href="#" class="btn btn-danger">Delete</a></td>--> 
     </tr> 
    </tbody> 
</table> 
<div class="muted text-left">Uploaded: {{ successfulUploads.length }}</div> 
</div>

正如我所说的，当我使用它ng-repeat="file in files"精美的作品。

并没有人建议使用blueimps文件上传，是的这是一个伟大的外观文件上传与伟大的功能，但我需要这个与我已经定义的角模块，当我试图转换它它停止工作。今天我下载了完整的源代码，并在本地主机上“按原样”运行，它给了我相同的确切错误，并且我处于截止日期。也许以后我可以重新访问它。

来源

2013-06-19 Jonathan Jones

你还没有给出任何错误的细节。 – Chandermani

这是因为没有错误，因为主题指示我正在尝试更新视图，因为我的HTML使用'successfulUploads'对象显示，当我记录该对象时，我获得了我期望的数组文件 –

紧接着第二：

$scope.files = [];

地址：

$scope.$apply()

那么它应该工作。

来源

2013-06-19 04:16:28 Nir

完美，谢谢。这正是我所期待的。我会尽快接受。 –

当作用域对象在内部将值更改为控制器的作用域时更新UI

回答

相关问题