Ручка браузера refre sh кнопка в Angular

Question

Мне нужно сделать тему false в браузере refre sh, кнопка назад и вперед в Angular. Я обработал кнопки назад и вперед с помощью события onPopState. Есть ли событие для обработки кнопки refre sh? Я попытался использовать window: beforeunload и window: onunload, но это не сработало.

Примечание: window: beforeunload и window: onunload работают при запуске приложения, мне просто нужно чтобы вызвать браузер, нажмите кнопку sh.

Answer 1

Вы можете использовать resolver в Angular для достижения этой цели. Отсюда вы сможете обрабатывать браузером refre sh разных маршрутов отдельно. Здесь происходит то, что распознаватель выполнит некоторый промежуточный код при нажатии на ссылку и до загрузки компонента.

1. Создание класса обслуживания, реализующего Resolve

   import { Injectable } from '@angular/core';
   import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
   
   @Injectable()
   export class PathOneResolver implements Resolve<any> {
     constructor(
     ) { }
   
     resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
       // Make the subject false
       console.log('Browser Refresh on Path1');
     }
   }
   

2. Зарегистрируйте службу распознавателя в файле module.ts под провайдерами

   import { PathOneResolver } from './services/worklist.resolver';
   
   @NgModule({
     providers: [ PathOneResolver ]
   })
   

3. Добавьте преобразователь в свой маршрут

   import { Routes } from '@angular/router';
   import { PathOneResolver } from './services/worklist.resolver';
   import { PathOneComponent} from '../main/components/pathone.component';
   import { BaseComponent } from '../main/components/base/base.component';
   
   export const approvalRoutes: Routes = [  
      { path: '', component: BaseComponent },  
      { path: 'pathone', component: PathOneComponent, resolve: 
        { pathone: PathOneResolver}}, 
   ];
   

Answer 2

Если вы хотите обнаружить браузер refre sh с Angular, вам нужно взглянуть на Angular Router. Конкретно для свойства навигации. Это свойство имеет значение false, когда маршрутизатор запускается и после первой навигации оно изменяется на true.

// in the constructor of you App Component
constructor(private router: Router) {
  this.subscription = router.events.subscribe((event) => {
    if (event instanceof NavigationStart) {
      browserRefresh = !router.navigated;
    }
  });
}

Вы можете установить желаемое свойство с помощью этой функции.