2016-02-19 8 views
8

में संवाद बॉक्स की पुष्टि करें मैं कोणीय में नीचे दिए गए बटन में पुष्टि संवाद बॉक्स कैसे लागू कर सकता हूं?angularjs

<button class="btn btn-sm btn-danger" ng-click="removeUser($index)">Delete</button> 

बस इसी तरह।

<span><a class="button" onclick="return confirm('Are you sure to delete this record ?')" href="delete/{{ item.id }}">Delete</span> 

अद्यतन

वर्तमान में मैं इसे इस

function removeUser(index) { 
     var isConfirmed = confirm("Are you sure to delete this record ?"); 
     if(isConfirmed){ 
     vm.users.splice(index, 1); 
     }else{ 
     return false; 
     } 
    }; 

उत्तर

13

यहाँ के टुकड़े है,

कैसे अपने HTML होना चाहिए,

<button class="btn btn-sm btn-danger" ng-confirm-click="Are you sure to delete this record ?" confirmed-click="removeUser($index)">Delete</button> 

कृपया अपने कस्टम 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) 
        } 
       }); 
      } 
     }; 
}]) 

आपका कोणीय गुंजाइश आधारित शामिल करें ऊपर उल्लिखित आपके हटाए गए फ़ंक्शन पर,

$scope.removeUser = function(index) { 
    vm.users.splice(index, 1); 
} 
+1

पूरी तरह से काम किया! धन्यवाद। –

5
$scope.removeUser= function (ind){ 
if (confirm("Are you sure?")) { 
    alert("deleted"+ s); 
    $window.location.href = 'delete/'+ s; 
} 
} 

http://jsfiddle.net/ms403Ly8/61/

, कि जिस तरह से
+0

बिल्कुल सही जवाब !! –

1

मैं हटाएं क्रिया बिट से संदेश बिट अलग होगा की तरह कर रहा हूँ आप दूसरे में पुष्टि बिट का पुन: उपयोग कर सकते हैं अपने अनुप्रयोग के कुछ हिस्सों: मैं बहुत की तरह एक निर्देश का उपयोग करें:

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(); 
      } 
     }); 
     } 
    }; 
    } 
]); 

फिर हटाएं कार्रवाई के साथ अपने नियंत्रक समारोह है:

$scope.removeUser(index) { 
    //do stuff 
} 

और दृश्य में मैं का प्रयोग करेंगे एनजी-क्लिक करें:

<span><a class="button" ng-confirm-click="Are you sure?" ng-click="removeUser(item.id}}">Delete</span> 

उम्मीद है कि यह मदद करता है।

0

आप इस प्लंकर को आजमा सकते हैं: 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) 
        } 
       }); 
      } 
     }; 
}])