Angular js-Richtlinie, um zu zeigen, Warnung für die zurück-Schaltfläche Ihres Browsers, wenn nicht gespeicherte Daten in form
Ich bin ein Neuling auf angularjs.Gibt es eine Möglichkeit, zu zeigen, Warnung, wenn ein Formular nicht gespeicherten Daten und drücken der zurück-Schaltfläche Ihres Browsers.
Irgendwelche Hinweise, wie dies zu erreichen wäre willkommen.
Update: :
angular.module('myApp.directives', []).directive('confirmOnExit', function() {
return {
link: function($scope, elem, attrs) {
$scope.$on('$locationChangeStart', function(event, next, current) {
if ($scope.myForm.$dirty) {
if(!confirm("Ahh the form is dirty, do u want to continue?")) {
event.preventDefault();
}
}
});
window.onbeforeunload = function(){
alert('me');
if ($scope.myForm.$dirty) {
return "The Form is Dirty.";
}
}
}
};
});
Aktualisierten code
angular.module('myApp.directives', []).directive('confirmOnExit', function () {
return {
link: function ($scope, elem, attrs, $rootScope) {
window.onbeforeunload = function () {
if ($scope.myForm.$dirty) {
return " do you want to stay on the page?";
}
}
$rootScope.$watch(function {
return $location.path();
},
function (newValue, oldValue) {
if (newValue != oldvalue) {
//here you can do your tasks
} else {}
},
true);
$scope.$on('$locationChangeStart', function (event, next, current) {
if ($scope.myForm.$dirty) {
if (!confirm("The form is dirty, do you want to stay on the page?")) {
event.preventDefault();
}
}
});
}
};
});
InformationsquelleAutor iJade | 2013-02-15
Du musst angemeldet sein, um einen Kommentar abzugeben.
Ja, ich gab diese Antwort vor ein paar Minuten an einen anderen Benutzer, erstellen eine Uhr, auf der root-scope level zu fangen location ändern:
aktualisiert meinen code schauen
Setzen Sie einfach die Uhr, die in der Richtlinie controller anstelle der Stamm-Umfang
ich habe gerade dat, aber es zeigt Fehler " Uncaught SyntaxError: Unexpected token return return $Speicherort.Pfad()
ich habe gerade aktualisiert und den geänderten code als pro ur Vorschlag oben.Schauen
InformationsquelleAutor remigio
Als Sie entdeckt haben, schreiben Sie eine benutzerdefinierte Richtlinie zu beobachten, für änderungen. Ihre aktualisierten code ist auf dem richtigen Weg, allerdings gibt es ein paar Dinge, die Sie tun können, um zu verbessern:
Ihre Richtlinie verweist auf die form von Namen, welche Grenzen es ist re-usability. Was zum Beispiel, wenn Sie wollten, verwenden Sie diese Anweisung in einem Formular aufgerufen
myOtherForm
? Derzeit mit$scope.myForm.$dirty
Grenzen dieser Flexibilität. Stattdessen wird ein besserer Ansatz ist die Bindung an die formController in Ihre verbindende Funktion.Es ist wirklich nicht brauchen, um zu sehen
$location.path()
da die Bindung an$locationChangeStart
wird das gleiche tun.Ich geschrieben habe, eine angularjs-Direktive, die Sie verwendet, die Ansätze habe ich oben besprochen. @siehe https://github.com/facultymatt/angular-unsavedChanges
Ich hoffe, Sie finden diese Richtlinie informativ. Fühlen Sie sich frei, daraus zu lernen, oder sogar verwenden Sie es in Ihrem Projekt.
InformationsquelleAutor facultymatt