Confirm before leave directive <p>This directive uses SweetAlert just as replacement of confirm() js function. <a href="https://jsfiddle.net/alfredopacino/njccccsh/" rel="nofollow">https://jsfiddle.net/alfredopacino/njccccsh/</a></p> <pre><code>app.directive('confirmLeave',function(){ return { restrict:"A", controller:function($scope,$attrs,SweetAlert,$state,$location){ $scope.$on('$destroy', function() { window.onbeforeunload = undefined; }); $scope.$parent.$on('$stateChangeStart', function(event, next, current) { console.log($scope.formname.$dirty) if($scope.formname.$dirty){ event.preventDefault() SweetAlert.swal({ title: "Are you sure you want to leave this page?", text: "Some changes have not been saved.", type: "warning", showCancelButton: true, confirmButtonColor: "#DD6B55",confirmButtonText: "Ok", cancelButtonText: "Cancel", closeOnConfirm: true, closeOnCancel: true }, function(isConfirm){ if (isConfirm) { console.log(next.name) $state.go(next.name) //$location.path(next.name) } }); } }); } }}); </code></pre> <p>It checks the form dirty state and it should follow the next route in case of confirm, but that $state.go() doesn't redirect.</p>