AngularJS window.onbeforeunload в одном контроллере запускается на другом контроллере
Вот моя проблема, у меня есть два вида (View1 и View2) и контроллер для каждого вида (Ctrl1 и Ctrl2). В View1 я пытаюсь предупредить пользователя, прежде чем он случайно покинет страницу без сохранения изменений.
Я использую window.onbeforeunload, который работает просто отлично, но моя проблема в том, что, хотя у меня onbeforeunload только на одном контроллере, событие, похоже, инициируется и на втором контроллере! Но у меня даже нет этого события там. Когда пользователь покидает страницу и появляются несохраненные изменения, он получает предупреждение от onbeforeunload, если пользователь отклоняет предупреждение и покидает страницу, возвращается ли он ко второму представлению, если пользователь пытается покинуть это другое представление, мы также будем предупреждены о несохраненных изменениях! Когда это даже не так! Почему это происходит?
Я также использую $ locationChangeStart, который работает просто отлично, но только когда пользователь меняет маршрут, а не когда он обновляет браузер, нажимает «назад» или пытается закрыть его, поэтому я вынужден использовать onbeforeunload ( Если вы лучше подходите, пожалуйста, дайте мне знать). Любая помощь или лучший подход будет принята с благодарностью!
//In this controller I check for window.onbeforeunload
app.controller("Ctrl1", function ($scope, ...)){
window.onbeforeunload = function (event) {
//Check if there was any change, if no changes, then simply let the user leave
if(!$scope.form.$dirty){
return;
}
var message = 'If you leave this page you are going to lose all unsaved changes, are you sure you want to leave?';
if (typeof event == 'undefined') {
event = window.event;
}
if (event) {
event.returnValue = message;
}
return message;
}
//This works only when user changes routes, not when user refreshes the browsers, goes to previous page or try to close the browser
$scope.$on('$locationChangeStart', function( event ) {
if (!$scope.form.$dirty) return;
var answer = confirm('If you leave this page you are going to lose all unsaved changes, are you sure you want to leave?')
if (!answer) {
event.preventDefault();
}
});
}
//This other controller has no window.onbeforeunload, yet the event is triggered here too!
app.controller("Ctrl2", function ($scope, ...)){
//Other cool stuff ...
}
Я попытался проверить текущий путь с помощью $ location.path (), чтобы предупредить пользователя только тогда, когда он находится в представлении. Я хочу, чтобы onbeforeunload сработал, но это выглядит как «хакерское» решение - не выполнять onbeforeunload с другой стороны. контроллер вообще.
Я добавил $ location.path ()! = '/ View1' в первом, который, кажется, работает, но мне это не кажется правильным, кроме того, что у меня не только два представления, у меня есть несколько представлений, и это было бы сложно с привлечением большего количества контроллеров:
app.controller("Ctrl1", function ($scope, ...)){
window.onbeforeunload = function (event) {
//Check if there was any change, if no changes, then simply let the user leave
if($location.path() != '/view1' || !$scope.form.$dirty){
return;
}
var message = 'If you leave this page you are going to lose all unsaved changes, are you sure you want to leave?';
if (typeof event == 'undefined') {
event = window.event;
}
if (event) {
event.returnValue = message;
}
return message;
}
//This works only when user changes routes, not when user refreshes the browsers, goes to previous page or try to close the browser
$scope.$on('$locationChangeStart', function( event ) {
if (!$scope.form.$dirty) return;
var answer = confirm('If you leave this page you are going to lose all unsaved changes, are you sure you want to leave?')
if (!answer) {
event.preventDefault();
}
});
}