.directive('confirmClick', function() {
return {
link: function (scope, element, attrs) {
// setup a confirmation action on the scope
scope.confirmClick = function(msg) {
// msg can be passed directly to confirmClick('are you sure?') in ng-click
// or through the confirm-click attribute on the <a confirm-click="Are you sure?"></a>
msg = msg || attrs.confirmClick || 'Are you sure?';
// return true/false to continue/stop the ng-click
return confirm(msg);
}
}
}
})
4条答案
按热度按时间d7v8vwbk1#
我已经在中放入了一个示例指令:
http://plnkr.co/edit/GJwK7ldGa9LY90bMuOfl?p=preview
我通过创建一个指令来实现它:
1.其中
priority
比ngClick
高,使得它在ngClick
之前被调用,1.生成
terminal
这样它就不会调用ngClick
。1.监听点击事件,然后评估
ngClick
值是否消息是OK。作为奖励,您可以传递自己的消息,例如:
代码如下所示:
btqmn9zl2#
我已经放弃了让皮兰的答案按我希望的那样工作,相反,我开始用我自己的指令替换ngClick:
这个指令甚至没有自己的作用域,这大大简化了它与其他指令的组合。它直接从
attrs
中获取所需的一切。它的用法如下:delete()
函数必须存在于$scope
链中更高的位置,我相信这可以通过更仔细地研究ng-click
是如何实现的来改进,但是我还没有抽出时间来研究它!j9per5c43#
我玩了很长一段时间,但是Angular的异步特性使得很难指望每个指令都能很好地一起运行。然后,我看到了@tosh的回答,这让我思考了一下。
我认为这结合了几个优点:* * 创建指令并在前面添加ngClick**
因此,只需将此指令添加到应用,然后将"confirm-click"属性添加到链接,并将confirmClick()函数添加到ngClick。
链接:
指令:
这非常类似于注入标准的confirm()对话框,但是因为您将其包含在一个指令中,所以可以自定义如何选择运行确认对话框(可能是一个漂亮的模态对话框,而不是窗口对话框)。
奖励答案
我对此进行了更多的尝试,并集成了一个使用模态窗口而不是默认窗口作为确认窗口的解决方案。https://stackoverflow.com/a/23718694/1135826
bqucvtff4#
您可以将
$window
注入到控制器中,以便可以从作用域使用$window.confirm
,然后: