JavaScript array.push (object) with Angular ng-repeat 无法按预期运

Question

我在应用程序的其他区域中几乎具有完全相同的代码片段，并且运行良好。

我正在将一个对象推入一个空数组中，并在我的视图中有一个 ng 重复。

JavaScript：

$scope.upload = $upload.upload({
    url: BASE + 'files/tasks',
    file: file,
    data: data
}).success(function(data) {
    for(var i = 0; i < $scope.case.task.notes.length; i++) {
        if($scope.case.task.notes[i].in_api === false) {
            $scope.case.task.notes[i].documents.push(data);
        }
    }
});

当我在将 JSON 响应添加到数组后console.log $scope.case.task.notes时，我看到了预期的结果(note 对象以及 documents 数组，返回的对象在 documents 数组中(。

在我看来，该页面在下面的 HTML 中增强了 Angular 模板：

<div>
    <p class="chat-file row" ng-repeat="document in note.documents track by $index">
        <b class="pull-left col-sm-6">
            <i class="fa fa-file"></i> {{document.name}} 
        </b>
        <span class="col-sm-6 pull-right"> 
            <a href="http:/download.com?f={{document.id}}&n={{document.name}}" class="btn btn-xs btn-success">download</a> 
        </span>
    </p>
</div>

当我第一次加载页面时，所有具有文档的笔记都会正确显示。 但是，当从上述 upload 函数调用成功函数，并将文档推送到笔记的数组中时，它不会出现在视图中。

如果它有所作为，上面的 HTML 也被包围在一个迭代每个音符的ng-repeat中(所以它是多级的(。

可能是什么问题？ JavaScript 函数运行正常，但模型运行时视图不会更新。

Answer 1

尝试使用 $scope.$apply(( 来告诉您的观点范围数据已更改：

 .success(function(data) {
     // Do what you want.
     $scope.$apply();
 });

$apply(( 用于从角度框架外部执行 angular 表达式。(例如，来自浏览器 DOM 事件、setTimeout、XHR 或第三方库(。因为我们正在调用角度框架，所以我们需要执行异常处理的适当范围生命周期，执行监视。

Answer 2

您似乎使用了不同的变量。 在 HTML 中，您使用note.documents：

ng-repeat="document in note.documents ...

在 JavaScript 中，您使用 $scope.case.task.notes[i].documents .

您需要使它们引用相同的数组。 也许如果你设置

$scope.documents = $scope.case.task.notes[i].documents;

并更改 HTML 以读取

ng-repeat="document in documents ..."

然后 Angular 与拾取更改？