Can't access nested array of scope object

Question

I have a 3 column display to mimick a kanban board. Each column does an ng-repeat on one $scope.list. I then filter each column to include the itmes I want. However now I want to be able drag an item from one column to another, and when dropping an item, perform a $http call to my rest api which will update that item.

I've looked at some tools like this - http://codef0rmer.github.io/angular-dragdrop/#/

But as far as I can tell this isn't any help to me as my data is all within one list.

The list that contains all the items is $scope.board and this it's JSON output.

  {
     "_id":"553b9fc4fee8d25ceeba6c92",
     "boardAuthor":"553b9e64fee8d25ceeba6c91",
     "title":"Board title",
     "description":"Whatever",
     "__v":0,
     "boardTickits":[
        {},
     ]
  }

I thought one approach could be to split $scope.board into separate arrays but I can't seem to access the nested array.

for(i = 0; i < $scope.board.boardTickits.length; i++) {
    if($scope.board.boardTickits.category == 1) {
        $scope.todoCol = $scope.board.boardTickits[i];
    } else if ($scope.board.boardTickits.category == 2) {
        $scope.doingCol = $scope.board.boardTickits[i];
    } else if($scope.board.boardTickits.category == 3) {
        $scope.doneCol = $scope.board.boardTickits[i];
    }
}

I get an error trying to get the length of the nested array.

If anybody provide some insight on accessing nested arrays that would be great, cheers!

Pankaj Parkar · Accepted Answer · 2015-04-26 19:16:34Z

1

Because you are doing .length of undefined object $scope.board.boardTickits. You need to change you for loop condition form $scope.board.boardTickits.length to $scope.board.length

for(i = 0; i < $scope.board.length - 1; i++) { 
    if($scope.board.boardTickits.category == 1) {
        $scope.todoCol = $scope.board.boardTickits[i];
    } else if ($scope.board.boardTickits.category == 2) {
        $scope.doingCol = $scope.board.boardTickits[i];
    } else if($scope.board.boardTickits.category == 3) {
        $scope.doneCol = $scope.board.boardTickits[i];
    }
}

edited Apr 26, 2015 at 19:16

answered Apr 26, 2015 at 19:12

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

frank Over a year ago

Thanks for the quick response! I'm now getting a different error though - TypeError: Cannot read property '0' of undefined. Any idea what it might mean?

Pankaj Parkar Over a year ago

@frank that was my bad, take a look at udpate

frank Over a year ago

Yeah the loop is correct now, but what had me thinking the loop was wrong in the first place is that $scope.todoCol is empty, but it shouldn't be, because in $scope.board.boardTickits, there are 3 objects which match the criteria category == 1.

Pankaj Parkar Over a year ago

@frank I don't understand what you are tried to say, could you please create fiddle or plunkr ?

frank Over a year ago

I tried setting it up here - plnkr.co/edit/Qn0aeKJrUXUfejFdEgiP?p=preview I've never used it before so maybe I left something out but it should give a better idea of my problem. Thanks for your help by the way.

|

Collectives™ on Stack Overflow

Can't access nested array of scope object

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related