Как обрабатывать/предотвращать навигацию браузера или перезагружать в angularjs?

Я хотел бы обнаружить в моем приложении angular, когда пользователь перемещается или перезагружает страницу.

Приложение (использующее какой-либо процесс входа в систему) должно затем отличить, что оно было перезагружено, поэтому пользователь не потеряет свои данные, а приложение сможет восстановить необходимую информацию из localStorage.

Пожалуйста, предложите несколько лучших методов для "обработки" перезагрузки/навигации браузера.

Ответы

Ответ 1

Все ваши javascript и в переменных памяти исчезают при перезагрузке. В js вы знаете, что страница была перезагружена, когда код запускается снова в первый раз.

Чтобы справиться с самой перезагрузкой (включая удар F5) и принять меры до перезагрузки или даже отмены, используйте событие "beforeunload".

var windowElement = angular.element($window);
windowElement.on('beforeunload', function (event) {
    // do whatever you want in here before the page unloads.        

    // the following line of code will prevent reload or navigating away.
    event.preventDefault();
});

Ответ 2

У меня была та же проблема, но ответ Бен не помог мне.

Этот ответ поставил меня на правильный путь. Я хотел добавить предупреждение о некоторых штатах, но не все из них. Вот как я это сделал (возможно, не самый чистый способ):

window.onbeforeunload = function(event) {
   if ($state.current.controller === 'ReloadWarningController') {
      // Ask the user if he wants to reload
      return 'Are you sure you want to reload?'
   } else {
      // Allow reload without any alert
      event.preventDefault()
   }
 };

(в определении ReloadWarningController, в котором был введен $state)