Angular $watch - execute watch block only once

Question

I have a simple $watch on a dropdown value :

$scope.view;
$scope.$watch('view', function(){
  console.log(1);       
  // watch block
}

The value is chaining with ng-model:

<select ng-model="view" ng-options="x for x in name">
</select>

Due to the $digest the value 1 is printed twice, is there a way to tell angular to execute the the $watch block only once?

kazenorin · Accepted Answer · 2016-06-30 08:05:06Z

1

Simple answer: unregister the watch after the first successful run:

var viewWatch = $scope.$watch('view', function () {
  viewWatch(); // Stops the watch
  console.log(1);       
  //watch block
};

However this may or may not yield the results you want, because sometime the $watch is called upon initialization. You may want to set some conditions:

var viewWatch = $scope.$watch('view', function (currentValue, oldValue) {
  if (currentValue && !oldValue) {
    viewWatch(); // Stops the watch
    console.log(1);       
    //watch block
  }
};

answered Jun 30, 2016 at 8:05

kazenorin

1,4758 silver badges16 bronze badges

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

Comments

davidkonrad · Accepted Answer · 2016-06-30 08:09:43Z

1

You could simply test if view is about to be set for the first time (declared) or is about to be changed (by the select) by testing the params :

$scope.$watch('view'), function(newVal, oldVal) {
  if (oldVal && oldVal != newVal) {
    console.log(1)
  }
}

answered Jun 30, 2016 at 8:09

davidkonrad

85.7k17 gold badges211 silver badges273 bronze badges

Collectives™ on Stack Overflow

Angular $watch - execute watch block only once

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related