История push перенаправляет состояние, а не просто помещает новое состояние в историю браузера

Question

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

Вот демонстрационное рабочее приложение. https://angular -tet5fy.stackblitz.io / стр.2? Fbclid = IwAR1zP_UTnCQxKMp8o3ZXf-n4NR3ftu_4JoulLqItaONa-_wSPJ_DT95OgRU

Это код:

ngAfterViewInit() {
    console.log('init called');
    var x = document.referrer;
    console.log('ref', x);

    if (x) {
      console.log('pushing state');
      this.location.pushState({id:'page3'}, 'Page3', '/page3');
    }
}

Ожидаемое поведение:

1. При нажатии на ссылку пользователь переходит на страницу 2.
2. Пока страница2 инициализирована, она должна выдвинуть состояние '/ page3' в историю браузера.
3. Когда пользователь снова щелкает браузер, он должен перейти к / page3, как он был перенесен в историю на шаге 2 выше.

Текущее поведение:

1. Нажав на ссылку, я перехожу на страницу page2, но она автоматически перенаправляет на страницу / page3 во время отправки состояния.
2. При нажатии на браузер обратно, он возвращает меня к /page2.

Answer 1

ngAfterViewInit() {
    console.log('init called');
    var x = document.referrer;
    console.log('ref', x);

    if (x) {
      console.log('pushing state');
      let locat = location.href;
      history.replaceState({id:'page3'},'Page3','/page3');
      history.pushState(null,null,locat);
    }
}

То, что мы делаем здесь, это изменение URL-адреса на URL , которым вы хотите быть обратно с помощью history.replaceState({id:'page3'},'Page3','/page3');, а затем создание новой записи в истории с помощью history.pushState(null, null,locat); с помощью первого URL-адреса..

Я уже отвечал вам на этот вопрос уже в двух разных постах с небольшим изменением:

Угловая платформаРасположение pushState не работает

Угловое: перевести пользователя на дом, нажав кнопку возврата браузера

Пример ветки в реальном времени: https://angular -stack-55624908.stackblitz.io / page2

Answer 2

Ожидаемое поведение: 1. При нажатии на ссылку пользователь переходит на страницу 2.2. Пока страница2 инициализирована, она должна выдвинуть состояние '/ page3' в историю браузера.3. Когда пользователь снова щелкает браузер, он должен перейти к / page3, как он был перенесен в историю на шаге 2 выше.

Поскольку то, что вы сделали, ваше состояние истории: p1 -> p2-> р3.Это в вашем описании!Вы хотите это так:

1. Нажатие на состояние первого нажатия ссылки p3
2. Затем переведите пользователя в p2 и не выдвигайте состояние при инициализации
3. Браузерназад теперь работает как положено

---

Редактировать:

Вот как вы можете это реализовать.В page2.component.ts.

ngOnInit() {
  history.replaceState({ data: 'at page 3' }, 'Page3', '/page3');
  history.pushState({ data: 'at page 2' }, 'Page2', '/page2');
}

Но опять же прочитайте doc .