oikonomiyaki
oikonomiyaki

Reputation: 7951

$observe an object attribute of a directive

My directive has an isolated scope and it receives object from the enclosing controller as an attribute.

app.directive('details', function() {
        return {
            restrict : 'E',
            scope : {
                device : '=device',
                .
                .
                .
            },
            templateUrl : '/details.html',
            link : function(scope, element, attrs) {
                attrs.$observe('device', function(value) {
                ...
                });
            }
        };
    });

And in HTML:

<details device='ctrlAlias.device' ...>

I read somewhere that if I want to check for changes in attribute, I need to use $observe function. However, most examples I saw use $observe on primitive values only.

I wonder how would I $observe a property of device, say device.exist (a boolean) and device.id (a string) within the attrs.$observe?

Upvotes: 1

Views: 453

Answers (1)

Satpal
Satpal

Reputation: 133403

You should use $watch

Registers a listener callback to be executed whenever the watchExpression changes.

Whereas, $observe is a method on the Attributes object

Observes an interpolated attribute.

Code

scope.$watch(function() {
    return scope.device
}, function(newValue, oldValue) {    
}, true);

Visit AngularJS : Difference between the $observe and $watch methods for more details.

Upvotes: 3

Related Questions