gpt4 book ai didi

javascript - Angular - 在指令中捕获 ng-click 并取消它

转载 作者:行者123 更新时间:2023-12-02 16:22:39 24 4
gpt4 key购买 nike

我编写了一个指令,用于捕获单击按钮时是否按住“shift”,如果是,则调用不同的函数。问题是,原来的 ng-click 操作也正在执行。我虽然 PreventDefault 或 stopPropagation 会阻止这种情况,但情况似乎并非如此。

HTML

  <body ng-app="app">
<div ng-controller="ctrl">
<button class="btn btn-default" ng-click="click1($event)" shift-ng-click="click2($event)">Click</button>
</div>
</body>

JS

var app = angular.module('app', []);

app.controller('ctrl', function($scope) {
$scope.click1 = function(event) {
console.log("Click 1");
}

$scope.click2 = function(event) {
console.log("Click 2");
}
});

app.directive('shiftNgClick', function() {
return {
restrict: "A",
link: function(scope, el, attrs) {
el.bind('click', function(event) {
if (event.shiftKey) {

event.preventDefault();
event.stopPropagation();
scope.$apply(attrs.shiftNgClick);
}
})
}
};
});

所以当scope.$apply()调用的函数被调用时,原来的ng-click()函数也会被调用。导致 click1() 和 click2() 被调用。

有没有办法阻止这种情况发生,或者最好完全忽略 ng-click,并将其全部放入指令中?

采摘者here

谢谢,丹

最佳答案

event.stopPropagation() 只会阻止父处理程序捕获事件。您正在寻找 event.stopImmediatePropagation(),它还会阻止附加到同一元素的其他处理程序运行。

关于javascript - Angular - 在指令中捕获 ng-click 并取消它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28963622/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com