Как лучше перезагрузить приложение Angular 2+?

Ссылка скопирована
1 ответ

Нужно понять: доброго дня, подскажите, возможно ли как то перезагрузить все приложение не перезагружая страницу?
Сейчас ситуация такая: location.reload() не предлагать:)

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Редакция DevOps Ответ

В Angular 2+ “перезагрузить всё приложение без перезагрузки страницы” можно только условно. Если нужно полностью сбросить состояние приложения, проще и честнее пересоздать состояние сервисов/стора и перейти на стартовый роут. Полностью уничтожить Angular-приложение и заново bootstrap-нуть его можно, но в обычном приложении это редко нужно и часто создаёт утечки.

Если задача — обновить текущий экран, используйте роутер:

this.router.navigateByUrl('/', { skipLocationChange: true }).then(() => {
  this.router.navigate([currentUrl]);
});

this.router.navigateByUrl('/', { skipLocationChange: true }).then(() => { this.router.navigate([currentUrl]); });

Если задача — сбросить данные пользователя после logout, правильнее очистить сервисы и storage:

logout() {
  this.authService.clearSession();
  this.store.dispatch(resetAppState());
  this.router.navigate(['/login']);
}

logout() { this.authService.clearSession(); this.store.dispatch(resetAppState()); this.router.navigate(['/login']); }

Если приложение на NgRx, сделайте meta-reducer для сброса состояния:

export function clearState(reducer: ActionReducer<AppState>) {
  return function(state: AppState | undefined, action: Action) {
    if (action.type === '[Auth] Logout') {
      state = undefined;
    }
    return reducer(state, action);
  };
}

export function clearState(reducer: ActionReducer<AppState>) { return function(state: AppState | undefined, action: Action) { if (action.type === '[Auth] Logout') { state = undefined; } return reducer(state, action); }; }

Если нужно перечитать конфиг с сервера, не надо перезагружать Angular. Сделайте метод reloadConfig и обновите зависимые сервисы. Если же изменились JS-бандлы после деплоя, без location.reload() или service worker update всё равно не обойтись.

Итог: для пользовательского сценария “начать заново” сбрасывайте состояние и роутинг. Для обновления версии фронта нужна перезагрузка страницы. Полный re-bootstrap Angular внутри той же страницы возможен, но это не лучший путь для нормального приложения.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно