在angularJS中拦截ng-click

Question

是否可以为ng-click编写拦截器？我有一个按钮或链接，导致后端对象的删除。我想通过将属性添加到按钮/链接来创建一个确认对话框（模式）。例如：

<a href="#" ng-click="deleteIt(id)" confirmation-needed>Delete</a>

AngularJS有可能吗？有没有更好的方法可以解决此问题？

编辑 deleteIt方法驻留在不同的控制器中。

谢谢

Answer 1

我在下面放了一个示例指令：

http://plnkr.co/edit/GJwK7ldGa9LY90bMuOfl?p=preview

我通过创建一个指令来实现它：

1. 具有较高的priority比ngClick，所以它被称为前ngClick，
2. 使它terminal不会调用ngClick。
3. 监听点击事件，然后评估ngClick该消息（如果消息正常）的值。

作为奖励，您可以传递自己的消息，例如：

<a href="#" ng-click="deleteIt(id)" 
    confirmation-needed="Really Delete?"
        >Delete with custom message</a>

代码如下：

app.directive('confirmationNeeded', function () {
  return {
    priority: 1,
    terminal: true,
    link: function (scope, element, attr) {
      var msg = attr.confirmationNeeded || "Are you sure?";
      var clickAction = attr.ngClick;
      element.bind('click',function () {
        if ( window.confirm(msg) ) {
          scope.$eval(clickAction)
        }
      });
    }
  };
});

希望有帮助。