[AngularJS] $watch

Angular 에서 어떤 변수의 값이 변경된 시점을 캐치해서 그 변경값과 변경전 값들로 뭔가를 구현 하고싶을 때  $watch 를 사용한다.
예를 들어 다음과 같이

function MyController($scope) {
    $scope.age = 100;

    $scope.$watch('age', function(newValue, oldValue){
        console.log('newValue : ' + newValue);
        console.log('oldValue : ' + oldValue);
    });
}

age에 100이란 값이 선언 되어있었는데 200이라고 값을 변경 했을 경우 newValue 값은 200, oldValue 값은 100으로 출력한다.
그렇다면 하나의 object 안에 들어있는 모든 property 들의 값을 변경시점에 new, old 값을 확인하고 싶다면 어떻게 할까 ?
방법은 다음과 같다.

function MyController($scope) {
    $scope.array = [
        user1: {
            name: 'sehee',
            age: 10
        },
        user2: {
            name: 'shaking',
            age: 20
        },
    ]

    $scope.$watch('array', function(newValue, oldValue){
        console.log('newValue : ' + newValue);
        console.log('oldValue : ' + oldValue);
    }, true); // 여기에 true 라고 넣어주면 된다
}

$watch 문 마지막에 (세번째 argument 에) true 라고 입력해주면 된다.


참고 :

https://stackoverflow.com/questions/19455501/watch-an-object

https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch