読者です 読者をやめる 読者になる 読者になる

LS&TK's SE Life Log

SE備忘録

$scope.$watchの挙動

$scopeにバリバリ値を設定している場合は、下記で$watchができます。ただし、$scopeの利用はグローバルスペースの汚染につながる為、現在はバッドプラクティスとされる例が多いようです。

$scope.val = 'some value';
$scope.$watch('val', function() {
  // scopeのvalが更新された時の処理
});

そこで、$scopeに値を設定せずcontrollerAsを使い、値を扱うのですが、その際は、$watchの書き方は下記になります。第一引数にwatchする変数をreturn文により返してやる必要がでるのです。

$scope.$watch(function() {
  return this.model.val;
}, function() {
  // modelのvalが変わった時
});

違いはそんくらいですが、知らずにはまってました。公式のドキュメントにはちゃんと乗っていたのにちゃんと見ていなかった……