如何在Angular JS中实现按钮双击触发操作？

你可以参照已有的右键指令结构，创建一个doubleClick指令，通过监听DOM的dblclick事件来实现双击检测：

指令代码 #

app.directive('doubleClick', function ($parse) {
    return function (scope, element, attrs) {
        var fn = $parse(attrs.doubleClick);
        element.on('dblclick', function (event) {
            // 触发AngularJS的digest循环，执行绑定的表达式
            scope.$apply(function () {
                fn(scope, { $event: event });
            });
            // 若需要阻止双击的默认行为（比如文本选中）或事件冒泡，可取消下面两行注释
            // event.preventDefault();
            // event.stopPropagation();
        });
    };
});

页面使用示例 #

<button double-click="yourDoubleClickHandler($event)" id="{{element.id}}">
    双击我试试
</button>

核心逻辑和右键指令一致，只是把监听的事件从contextmenu（右键菜单事件）换成了dblclick（双击事件）。你可以在yourDoubleClickHandler里定义双击触发后的具体操作，比如弹窗、执行业务逻辑等。

内容的提问来源于stack exchange，提问作者M Junaid