AngularJS - How can I $watch a deeply nested array?

Question

I currently have data that looks like the following:

$scope.boardLists = [{
cards: [{a:1, b:2}, {a:2, b:2}]
},

{
cards: [{a:3, b:3}, {a:4, b:4}]
},

{
cards: [{a:5, b:5}, {a:6, b:6}]
}];

How can I watch for changes in the cards array?

I have tried the following so far:

$scope.$watchCollection('boardLists', function(newVal, oldVal){
console.log(newVal);
console.log(oldVal);
});

$scope.$watch('boardLists', function(newVal, oldVal){
console.log(newVal);
console.log(oldVal);
}, true);

option 2 will work

floribon
– floribon

2016-03-17 23:09:22 +00:00
Commented Mar 17, 2016 at 23:09 — floribon
– floribon, Commented Mar 17, 2016 at 23:09

georgeawg · Accepted Answer · 2018-12-18 17:35:40Z

2

Scope `$watch` Depths

$scope.$watch('boardLists', function(newVal, oldVal){
  console.log(newVal);
  console.log(oldVal);
}, true);

Use $scope.$watch('item',fn,true); for a deep watch.

For information, see AngularJS Developer Guide - $scope Watch Depths.

edited Dec 18, 2018 at 17:35

answered Mar 17, 2016 at 23:07

georgeawg

49k13 gold badges78 silver badges98 bronze badges

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

Comments

webdeb · Accepted Answer · 2016-03-17 23:07:51Z

0

$watch is a bit expensive, you can try to use $apply

$scope.$apply(function() {
  // do something with the scope
  $scope.boardList.push({cards:...});
});

$apply will automatically rerun your templates

answered Mar 17, 2016 at 23:07

webdeb

13.3k5 gold badges32 silver badges44 bronze badges

2 Comments

floribon Over a year ago

I wonder you gave you +1, this "answer" is so unrelated, so random. Funny though.

webdeb Over a year ago

this is charme, bro :)

Collectives™ on Stack Overflow

AngularJS - How can I $watch a deeply nested array?

2 Answers 2

Scope `$watch` Depths

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Scope $watch Depths

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related

Scope `$watch` Depths