Как предотвратить постоянное обновление страницы в angular с помощью window.location

Question

У меня есть простая страница в angular, мне нужно, чтобы она была вручную обновлена ​​sh во время загрузки из-за некоторых требований в моем проекте. Я добавил код, и он работает нормально, но постоянно обновляет страницу. Мне нужно помешать здесь повторно ссылаться на sh. Вот код ниже.

home.component.ts

import { Component, OnInit } from '@angular/core';
@Component({
  selector: 'app-home',
  template: '<button (click)="gonextPage()">Go to next page</button>',
  styleUrls: ['./home.component.css']
})

export class HomeComponent implements OnInit {
constructor() { }
  ngOnInit() {
     window.location.reload();
    /* First data */
    console.log('hello');
  }

}

Answer 1

Я не знаю, почему вы хотите обновить sh страницу.

Но то, что происходит в вашем случае, это

Первый раз app-home инициализируется и страница обновляется. Снова после перезагрузки страницы app-home инициализируется, страница обновляется и т. Д.

Так что, чтобы не дать вам воспользоваться хакерским решением. Который, очевидно, потерпит неудачу в некоторых случаях.

Решение -

ngOnInit() {
   if (!sessionStorage.getItem('isPageRefreshed')) { 
       sessionStorage.setItem('isPageRefreshed', 'true');
      // This will reload page once prevent reloading of page again for that session. 
       window.location.reload();

   }
 }

Answer 2

Я все еще думаю, что это в любом случае дублирующий вопрос ... Попробуйте это решение:

if (!localStorage.getItem('firstReload') || localStorage.getItem('firstReload') == 'true') {
  localStorage.setItem('firstReload', 'false');
  window.location.reload();
} else {
  localStorage.setItem('firstReload', 'true');
}

Это рабочий пример: https://stackblitz.com/edit/angular-correct-routing?file=src%2Fapp%2Fpage.component.ts

Это работает как при нажатии на ссылку с домашней страницы, так и при обновлении страницы.