Есть ли способ закрыть модал с помощью кнопки «Назад», не изменяя состояния истории браузера?

Question

У меня довольно специфический вариант использования.

Представьте, что я перехожу с Страница A на Страница B (добавляет одно состояние истории). На странице B я взаимодействую со страницей, открывая модальный. Но модал реализован таким образом, что он закрывается при нажатии кнопки возврата браузера.

при открытом модале:

ngOnInit(): void {
        history.pushState(null, null, this.pageBHomeUrl + "?modal");
    }

и при закрытии модальное состояние заменяется предыдущим домашним URL:

close(): void {
        history.replaceState(null, null, this.pageBHomeUrl);
    }

Когда я закрываю модальное окно, история моего браузера выглядит так (сначала самое последнее)

• pageBHomeUrl
• страницаА

Однако я хочу убедиться, что могу закрыть модальный , сохраняя страницу A как самое последнее состояние истории ... Есть ли способ удалить состояние истории pageBHomeUrl или переместить состояние страницы вперед? Или закрыть модал с помощью кнопки назад без изменения истории состояний?

Answer 1

Когда вы переходите от А к В, ваша история выглядит так:

• страницаА
• pageBHomeUrl - текущий

Когда вы откроете модал и позвоните pushState, ваша история будет выглядеть так:

• страницаА
• pageBHomeUrl
• pageBHomeUrl? Модальный - текущий

Когда вы затем закроете модал с помощью кнопки и позвоните replaceState, ваша история будет выглядеть так:

• страницаА
• pageBHomeUrl
• pageBHomeUrl - текущий

Это не то, что вы хотите. Вместо replaceState, используйте popState в обработчике close, чтобы вернуться от модального к желаемой истории:

• страницаА
• pageBHomeUrl - текущий