Skip to main content
 首页 » 编程设计

angularjs之在angularJS中拦截ng-click

2025年02月15日18shanyou

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

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

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

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

谢谢

请您参考如下方法:

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

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

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

  • priorityngClick高的
  • ,因此它在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) 
            } 
          }); 
        } 
      }; 
    }); 
    

    希望能有所帮助。