角度回调数组推送问题答案

【问题标题】：Angular callback array push issue角度回调数组推送问题
【发布时间】：2016-06-08 09:14:37
【问题描述】：

我正在尝试创建一个 cmets 部分，类似于 instagram 的部分，其中显示了 cmets 列表，以及每个评论的用户配置文件和用户名。

我有一个正在解析的 cmets 表和一个正在解析的用户表，因此我必须对每条评论执行进一步查询以获取个人资料图片链接和用户名。

我正在使用 Angular 来执行此操作。我有一个 cmets 数组来存储所有评论，并且我将一个对象推送到该数组上，其中包含： - 用户名 - 个人资料图片 - 评论

var commentQuery = parseQuery.new('Comment');
commentQuery.equalTo("ID", id);
parseQuery.find(commentQuery)
.then(function(results) {
    for(var i =0; i < results.length; i++){
        var comment = results[i].get('comment');
        var userQuery = parseQuery.new('_User');
        userQuery.equalTo("objectId", results[i].get('userObject')[0].id);
        parseQuery.find(userQuery)
        .then(function(user) {  
            var commentObject = {
               comment: comment,
               username : '',
               profile: ''
        }
            commentObject['profile'] = user[0].get('profile_picture')['_url'];
            commentObject['username'] = user[0].get('liveUsername');
            $scope.comments.push(commentObject);    
        })
    }   
})

然后这在我的 ng-repeat 中产生的是一个列表，具有正确数量的 cmets，但是所有 cmets 都是相同的！

如果我在下载 cmets 时将它们打印到控制台，则它们是正确的。正是在对象创建时出现问题，并且所有评论对象中都放置了相同的数据。

【问题讨论】：

将 $scope.commentObject 更改为 var commentObject

标签： javascript angularjs callback angularjs-scope angularjs-ng-repeat

【解决方案1】：

$scope.comments 包含乘法 $scope.commentObject，因此当您更改 $scope.commentObject 时，它会在整个数组中更改。您可以在.then(function(user) { 回调中创建新的变量并将其推送到数组。

【讨论】：

【解决方案2】：

@OP 事情是 $scope.commentObject 是一个引用，所以当你更新这个对象时，它的所有引用都会更新为相同的值。考虑这个例子：

var list=[];
$scope.obj="a";
list.push($scope.obj);
console.log(list);  //it will print ['a']
$scope.obj="b";
console.log(list);  //it will print ['b'] , even though  we haven't pushed any new value in the list.

您会发现问题在于您一次又一次地推送相同的引用。要解决它，请将您的代码更改为以下内容：

parseQuery.find(userQuery)
    .then(function(user) {  
        var commentObject = {
           comment: comment,
           username : '',
           profile: ''
    }
        commentObject['profile'] = user[0].get('profile_picture')['_url'];
        commentObject['username'] = user[0].get('liveUsername');
        $scope.comments.push(commentObject); 
    })

【讨论】：

确实这确实解决了重复项目的问题，但是在按照建议进行更改后，我现在在每个用户名下都重复了相同的评论。即每个列表项显示用户名，然后显示完全相同的评论。这与评论在内部回调之外的事实有关吗？

【解决方案3】：

提供的解决方案是正确的，如果如上所述，您仍然有相同的评论，您应该手动检查它在用户表中的内容

【讨论】：