无法分配给只读属性true - AngularJS

时间:2015-12-07 11:25:03

标签: angularjs

我在代码中为$scope.milestones对象分配了一些属性时遇到了问题。

MilestonesService.query({ gameId: $stateParams.gameId }, function(data) {
    $scope.milestones = data;
    for(var i in $scope.milestones) {
        if($scope.milestones[i]._id) {
            $http.get('/admin/tasks/byMilestone/' + $scope.milestones[i]._id).success(function(tasks) {
                $scope.milestones[i].tasks = tasks.length;
                $scope.milestones[i].tasksSolved = tasks.length;
                tasks.forEach(function(task) {
                    if(!task.evaluate.accepted) $scope.milestones[i].tasksSolved -= 1;
                }); 
            }).error(function(err) {
                console.log(err);
            });
        }
    }
});

它向控制台抛出错误:无法分配给只读属性'tasks'为true,问题出现在$scope.milestones[i].tasks$scope.milestones[i].tasksSolved的行上。为什么我无法分配值并扩展每个$scope.milestones对象?

编辑: 数据

0: Resource
$$hashKey: "01J"
__v: 0
_id: "5664b44b4a502abc27613d7b"
assignedToGame: "5664a04eeff8972c24651371"
date: "2015-12-19T00:00:00.000Z"
description: "Haha"
solved: false
title: "Milestones works"
__proto__: Resource
$promise: Object
$resolved: true
length: 1
__proto__: Array[0]

$ scope.milestones [I]:

$$hashKey: "01J"
__v: 0
_id: "5664b44b4a502abc27613d7b"
assignedToGame: "5664a04eeff8972c24651371"
date: "2015-12-19T00:00:00.000Z"
description: "Haha"
solved: false
title: "Milestones works"
__proto__: Resource

2 个答案:

答案 0 :(得分:0)

替换为平常

MilestonesService.query({ gameId: $stateParams.gameId }, function(data) {
    $scope.milestones = data;
    for(var i=0;i<$scope.milestones.length; i++) {
        if($scope.milestones[i]._id) {
            $http.get('/admin/tasks/byMilestone/' + $scope.milestones[i]._id).success(function(tasks) {
                $scope.milestones[i].tasks = tasks.length;
                $scope.milestones[i].tasksSolved = tasks.length;
                tasks.forEach(function(task) {
                    if(!task.evaluate.accepted) $scope.milestones[i].tasksSolved -= 1;
                }); 
            }).error(function(err) {
                console.log(err);
            });
        }
    }
});

或使用下划线forEach:

MilestonesService.query({ gameId: $stateParams.gameId }, function(data) {
    $scope.milestones = data;
    _.forEach(function(milestone){
        if(milestone._id) {
            $http.get('/admin/tasks/byMilestone/' + milestone._id).success(function(tasks) {
                milestone.tasks = tasks.length;
                milestone.tasksSolved = tasks.length;
                tasks.forEach(function(task) {
                    if(!task.evaluate.accepted) milestone.tasksSolved -= 1;
                }); 
            }).error(function(err) {
                console.log(err);
            });
        }
    });
});

答案 1 :(得分:0)

正如您所看到的,数据对象不是数组,而是具有一些其他属性的类似数组的javascript对象,因此for(var i in $scope.milestones) {将迭代scope.milestones的对象属性,并最终到达milestones.$resolved (===true),这是一个布尔值,所以试图访问它的成员会在问题中抛出错误。但是,如果一个数组,它仍然是bad practice to iterate over array indices with for..in

要快速解决方法,您可以将for..in更改为:

for(var i = 0; i < $scope.milestones.length; i++) {

或使用Array.prototype.forEach.call

Array.prototype.forEach.call($scope.milestones, function(item) {
    if(item._id) {
        $http.get('/admin/tasks/byMilestone/' + item._id).success(function(tasks) {
            item.tasks = tasks.length;
            item.tasksSolved = tasks.length;
            tasks.forEach(function(task) {
                if(!task.evaluate.accepted) item.tasksSolved -= 1;
            }); 
        }).error(function(err) {
            console.log(err);
        });
    }
});