如何在AngularJS中更改范围时重新应用指令

Rob*_*ian 4 javascript directive angularjs

说你有这样的事情:

<div mydirective>
  {{boundtoscope}}
</div>
Run Code Online (Sandbox Code Playgroud)

并且您希望将mydirective应用于$ scope.boundtoscope的更改.你如何指导Angular重新申请该指令?

Mar*_*cok 8

在你的指令的link函数中,$ watch scope属性:

myApp.directive('mydirective', function () {
  return {
    link: function (scope, element, attrs) {
      scope.$watch('boundtoscope', function(newValue) {
          alert('boundtoscope changed');
          // do something here
      });
    }
  }
});
Run Code Online (Sandbox Code Playgroud)

如果boundtoscope是数组或对象映射,并且您想要查找对数组/对象中的项的更改,请将objectEquality参数设置true为执行"浅"监视(即,比较数组/对象是否相等而不是参考):

  scope.$watch('boundtoscope', function(newValue) {
      alert('boundtoscope changed')
  }, true);    // "shallow" compare
Run Code Online (Sandbox Code Playgroud)

Angular 1.2为此添加了一个新方法,$ watchCollection:

  scope.$watchCollection('boundtoscope', function(newValue) {
      alert('boundtoscope changed')
  });  // also does a "shallow" compare
Run Code Online (Sandbox Code Playgroud)