angularjs - 在angularJS中拦截ng-click

Question

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

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

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

编辑 deleteIt方法位于不同的 Controller 中。

谢谢

Answer 1

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

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

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

的priority比ngClick高的

，因此它在ngClick，

之前被调用

生成该terminal，以便它不调用ngClick。

监听单击事件，然后在消息正常的情况下评估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)
        }
      });
    }
  };
});

希望能有所帮助。