angularjs – 多个指令实例和事件

前端之家收集整理的这篇文章主要介绍了angularjs – 多个指令实例和事件前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个指令,我在页面上多次使用.它在状态改变时触发事件,然后控制器处理事件.

问题是该事件被触发两次.我知道为什么会发生这种情况,但我要么试图找到解决方法或更好的设计.有小费吗?

Plunker示例:http://plnkr.co/edit/xObOvi253qejphU5arFr

您需要定义隔离范围以使指令可重用.一个简单的解决方法添加范围:{}以创建一个隔离的范围,这样当您单击每个按钮时,它只会触发一次.
app.directive('myDirective',function () {
  return {
    restrict: 'E',scope: {},// Add this line to create an isolated scope
    template: '<div>Foo: {{foo}}</div><button ng-click="incrementFoo()">Increment Foo</button>',controller: function ($scope) {
      $scope.foo = 0;
      $scope.incrementFoo = function () {
        $scope.foo += 1;
      };

      $scope.$watch('foo',function () {
        $scope.$emit('fooChanged',{foo: $scope.foo});
        console.log($scope);
      });
    }
  };
});
原文链接:https://www.f2er.com/angularjs/142118.html

猜你在找的Angularjs相关文章