Закрыть боковое меню по щелчку сзади

Question

Я создаю приложение Angular и испытываю проблемы с закрытием меню в popstate.когда боковое меню открыто и пользователь нажимает кнопку «Назад» на своем мобильном устройстве, я хочу, чтобы меню закрывало меню, для этого я использую такое состояние pop

@HostListener('window:popstate', ['$event'])
  onPopState(event) {
    if (this.isMenuOpened) {
      this.toggleSidebar();
    }
      return ;
  }

Проблема, с которой я столкнулся, заключается в том, чтообратное действие также работает, поэтому меню закрывается, но также происходит обратное действие.я не могу использовать history.go(1), потому что он снова загружает страницу, и я не хочу такого поведения.

у вас были какие-нибудь идеи?

Answer 1

попробуйте это -

 $(window).on( "popstate", function(event){
          if( !event.originalEvent.state ){
          history.pushState( "nohb", null, "" );
          return;
          }
      });

Вместо history.go (1) используйте window.history.forward ()

window.history.forward () эта функция на первой странице использует историю браузера и заставляет ее перемещаться вперед, а не переходить на предыдущую страницу.Поэтому каждый раз, когда пользователь нажимает кнопку «Назад», браузер перемещается или перемещает пользователя вперед и отображает одну и ту же страницу.

Answer 2

Popstate не подлежит отмене согласно спецификации .Тем не менее, вы можете попробовать сделать это

@HostListener('window:popstate', ['$event'])
onPopState(event) {
    if (this.isMenuOpened) {
        event.preventDefault();
        history.go(1); // re-changes the url to what it should be
        this.toggleSidebar();
    }
    return ;
}