Angular 새로고침 방법

메뉴에 route를 구성해주어도 라우팅된 메뉴를 한번 더 크릭하면 아무일도 일어나지 않습니다.

 

load(href: string) {
   this.router.navigateByUrl('/blank-for-reload', {
     skipLocationChange: true,
   }).then(
     () => {
       this.router.navigateByUrl(href);
     }
   );
 }

많은 분들이 사용하는 방법이 blank한 페이지를 한번 띄워주고 다시 의도한 페이지를 띄우는 것인데 이는 새로고침과 같은 효과를 볼 수 있습니다.

 

메뉴를 클릭하면 직접 router에 navigateByUrl을 부르지 않고 위처럼 한번 감싼 load메소드를 호출함으로서 메뉴에서 버튼을 누르면 빈화면으로 갔다가 의도한 패스로 가는 것입니다.

 

주의할 점은 반드시 skipLocationChange:ture 로 지정해주어 뒤로가기에 스택이 쌓이지 않게 해야합니다.