Javascript angularjs 中的确认对话框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/35501303/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Confirm dialog box in angularjs
提问by Believe It or Not
How can I apply confirm dialog box in below button in angularjs ?
如何在 angularjs 的下面按钮中应用确认对话框？
<button class="btn btn-sm btn-danger" ng-click="removeUser($index)">Delete</button>
Just like this.
像这样。
<span><a class="button" onclick="return confirm('Are you sure to delete this record ?')" href="delete/{{ item.id }}">Delete</span>
Update
更新
Currently I am doing it like this
目前我正在这样做
function removeUser(index) {
var isConfirmed = confirm("Are you sure to delete this record ?");
if(isConfirmed){
vm.users.splice(index, 1);
}else{
return false;
}
};
回答by Mohideen bin Mohammed
Here is the snippets,
这里是片段，
how your HTML should be,
你的 HTML 应该是怎样的，
<button class="btn btn-sm btn-danger" ng-confirm-click="Are you sure to delete this record ?" confirmed-click="removeUser($index)">Delete</button>
Please Include this directive in your custom angularjs file,
请在您的自定义 angularjs 文件中包含此指令，
app.directive('ngConfirmClick', [
function(){
return {
link: function (scope, element, attr) {
var msg = attr.ngConfirmClick || "Are you sure?";
var clickAction = attr.confirmedClick;
element.bind('click',function (event) {
if ( window.confirm(msg) ) {
scope.$eval(clickAction)
}
});
}
};
}])
Your angular scope based on your delete function mentioned above,
基于上面提到的删除功能的角度范围，
$scope.removeUser = function(index) {
vm.users.splice(index, 1);
}
回答by a.u.b
$scope.removeUser= function (ind){
if (confirm("Are you sure?")) {
alert("deleted"+ s);
$window.location.href = 'delete/'+ s;
}
}
回答by Jax
I would separate the message bit from the delete action bit, that way you could reuse the confirm bit in other parts of your app: I use a directive like so:
我会将消息位与删除操作位分开，这样您就可以在应用程序的其他部分重用确认位：我使用如下指令：
angular.module('myModule').directive("ngConfirmClick", [
function() {
return {
priority: -1,
restrict: "A",
link: function(scope, element, attrs) {
element.bind("click", function(e) {
var message;
message = attrs.ngConfirmClick;
if (message && !confirm(message)) {
e.stopImmediatePropagation();
e.preventDefault();
}
});
}
};
}
]);
then have your controller function with the delete action:
然后让您的控制器功能与删除操作：
$scope.removeUser(index) {
//do stuff
}
and in the View I would use ng-click:
在视图中，我会使用 ng-click：
<span><a class="button" ng-confirm-click="Are you sure?" ng-click="removeUser(item.id}}">Delete</span>
hope it helps.
希望能帮助到你。
回答by Gracia
You can try this plunker: http://plnkr.co/edit/xJJFxjYeeHmDixAYPu4c?p=previewYou can create a directive for the dialog.
你可以试试这个 plunker：http://plnkr.co/edit/xJJFxjYeeHmDixAYPu4c?p=preview 你可以为对话框创建一个指令。
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope, $window) {
$scope.delete = function(id) {
$window.location.href = 'delete/'+ id;
}
});
app.directive('ngConfirmClick', [
function(){
return {
link: function (scope, element, attr) {
var msg = attr.ngConfirmClick || "Are you sure?";
var clickAction = attr.confirmedClick;
element.bind('click',function (event) {
if ( window.confirm(msg) ) {
scope.$eval(clickAction)
}
});
}
};
}])
