Question

我刚刚从我的数据库中检索到JSON数据，在我的成功回调中，我更新了一个应该更新我的DOM的$scope.requests数组。但是，即使数组的值发生了变化，也没有任何反应。

我对Angular很陌生，所以我可能会错过一些相当直接的东西：

回调代码：（FetchUserCtrl的一部分）

// Success callback from server - returns the data from PHP file
callback.success(function(data) {

        // Build the request array to update DOM
        for (var i = 0; i < data.length; i++) {
            $scope.requests.push( { name: data[i].name, dob: data[i].dob } );
        }

        $scope.apply(); <-- I read that this should apply changes.
});

HTML

<aside id="previousFeed" ng-controller="FetchUserCtrl">
    <div class="priorResult" ng-repeat="request in requests">
        <p>{{ "hi" }}</p>
    </div>
</aside>

我想要发生的是，在成功回调中更改$scope.requests数组时，应为div数组中的每个对象绘制$scope.requests。

我在这里做错了什么？

Answer 1

我认为你应该这样做。

$scope.$apply(function() {
   for (var i = 0; i < data.length; i++) {
     $scope.requests.push( { name: data[i].name, dob: data[i].dob });
   }
});

或类似的东西

$scope.$apply(function() {
   var request = [];
   for (var i = 0; i < data.length; i++) {
     requests.push( { name: data[i].name, dob: data[i].dob });
   }

   $scope.$apply(function() {
     $scope.requests = request;
   });
});

Answer 2

您的代码看起来是正确的。您不需要使用$ scope。$ apply调用。这不是必需的。

我假设您知道您的HTML不正确。它需要是这样的：

<aside id="previousFeed" ng-controller="FetchUserCtrl">
    <div class="priorResult" ng-repeat="request in requests">
        <p>{{request.name - {{request.dob}}</p>
    </div>
</aside>

再次，删除$ scope。$ apply调用并检查你的html。在那个帖子之外的一个plunker所以我们可以看到问题在行动。

Answer 3

我认为你的代码应该按照你编写的方式工作。如果你可以把那个在plunker或jsfiddle中失败的部分放进去，我打赌一个解决方案可以很快到达。此外，在这样的直接情况下，不应该需要$ scope.apply（）。

Answer 4

我不确定为什么这会产生影响，但移动到定义ng-controller的地方解决了我的问题。

我从行中删除了ng-controller：

<aside id="previousFeed" ng-controller="FetchUserCtrl">

将其移至

<body ng-controller="FetchUserCtrl">

我不明白为什么这会产生影响，因为从我理解的子节点将使用其父节点的控制器，在我的情况下，父节点是aside

对此的任何澄清都会很棒。

如何触发ng-repeat

4 个答案: