How to use a $watchGroup with object equality or deep-watch the properties in the group?

Question

I want a directive to re-render HTML whenever three scope variables have changed. The first two are just integers, the third is an array.

We have $watchGroup

Answer 1

I also had the same problem as yours.

My solution to this deep watchgroup problem is:

// Create new object to watch different types of objects
var objectToBeWatch = {
    number1: number1, 
    number2: number2,
    myArray: myArray
};

$scope.$watch(
    function () {
        return objectToBeWatch;
}, callback, true);

I hope this helps!