How to know the changed property of an object using angularJS

Question

app.controller('indexController', ['$scope', 'authService', function ($scope, authService) {

    var vm = this;

    vm.$onInit = function () {
        vm.active = {
            "home": true,
            "welcome": false,
            "user": false,
            "logout": false,
            "login": false,
            "signup":false
        };
    };

    $scope.$watch('vm.active', function (newObj, oldObj) {
        // How to detect which property has changed ?
    }, true);

}]);

This way i tried, but i don't know how can i detect in watch(shown in my example code), which property has changed.

@DaveNewton Yes. Say, if i make user = true then i want "user" property. — Arif
– Arif, Commented Aug 15, 2017 at 19:50

felixmosh · Accepted Answer · 2017-08-15 19:57:29Z

2

You can run on the keys of one of the object, and filter it by the value. Something like that:

const obj1 ={
    "home": true,
    "welcome": false,
    "user": false,
    "logout": false,
    "login": false,
    "signup":false
};

const obj2 = {
    "home": true,
    "welcome": false,
    "user": false,
    "logout": true,
    "login": true,
    "signup":false
};

const diff = Object.keys(obj1).filter((key) => obj1[key] !== obj2[key])

answered Aug 15, 2017 at 19:57

felixmosh

35.8k10 gold badges81 silver badges99 bronze badges

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

Comments

Bassam · Accepted Answer · 2017-08-15 19:58:44Z

0

i think watcher can't detect and property that's changed , you can make trick solution by using watchGroup or watchCollection ( see $watchCollection will shallow watch the properties on a single object and notify you if one of them changes.

$watchGroup however watches a group of individual watch expressions.)

also you can check ( how to know which object property changed? ).

answered Aug 15, 2017 at 19:58

Bassam

8568 silver badges17 bronze badges

Comments

h01001000 · Accepted Answer · 2017-08-15 20:02:11Z

0

const obj1 ={
    "home": true,
    "welcome": false,
    "user": false,
    "logout": false,
    "login": false,
    "signup":false
};

const obj2 = {
    "home": true,
    "welcome": false,
    "user": false,
    "logout": true,
    "login": true,
    "signup":false,
    "somethingNew": false
};


for (myProperty in obj2){
    if (obj2[myProperty] !== obj1[myProperty]){
        alert(myProperty + ' has changed!');
    }
}

I believe this should do the trick using a for...in loop.

edited Aug 15, 2017 at 20:02

answered Aug 15, 2017 at 19:57

h01001000

2818 silver badges20 bronze badges

Collectives™ on Stack Overflow

How to know the changed property of an object using angularJS

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related