AngularJS在$scope数组上使用ng-repeat

AngularJS using ng-repeat on a $scope array

本文关键字:ng-repeat 数组 scope AngularJS      更新时间:2023-09-26

我有一个控制器,通过 Parse,成功地检索并将对象推送到数组上,如下所示:

var mySite = angular.module('mySite', []);
mySite.controller('listConnectors', ['$scope',
    function ($scope) {
        //Parse.initialize here;
        $scope.array = [];
        var TestObject = Parse.Object.extend("TestObject");
        var query = new Parse.Query(TestObject);
        query.find({
            success: function (results) {
                alert("Successfully retrieved " + results.length + " rows.");
                // Do something with the returned Parse.Object values
                for (var i = 0; i < results.length; i++) {
                    var object = results[i];
                    alert(object.id + ' - ' + object.get('foo') + " " + object.get('num'));
                    /***** Pushing onto array here *******/
                    $scope.array.push(object);
                }
                console.log($scope.array[0].attributes.foo); //Grabbed what was needed
            },
            error: function (error) {
                alert("Error: " + error.code + " " + error.message);
            }
        });
}]);

然后,我尝试循环并列出数组中每个对象的"foo"值,但没有成功.log如上面的控制台所示。但是,不会输出任何内容。就好像 ng-repeat 可能没有被执行或输入:

    <li ng-repeat="eachElement in array">
    <a > {{eachElement.attributes.foo}}</a>
    </li>

任何帮助将不胜感激。谢谢!

我能够修复它。谢谢乔纳森·洛诺夫斯基的评论和链接。

我不得不用$apply将推送包装到阵列上:

$scope.$apply(function(){
  $scope.array.push(object);
});

警报语句中的代码和 ng-repeat 指令中的代码不匹配。警报访问"x.id",而 dom 绑定访问"x.attributes.id"。

如果警报显示预期结果,则应按如下所示更改 HTML:

<li ng-repeat="eachElement in array">
<a > {{eachElement.id}}</a>
</li>