У меня проблема, когда я пытаюсь нажать функцию esc, чтобы закрыть полноэкранный режим моего приложения. Полноэкранный режим и закрытие полноэкранного режима уже работают. Но проблема в том, что когда я сейчас в полноэкранном режиме и пытаюсь нажать клавишу esc, он закрывает полноэкранный режим, но слово «Открыть» все еще отображается. Пожалуйста, смотрите мои коды ниже. Нажмите также на мою ссылку stackblizk здесь https://stackblitz.com/edit/fullscreen-closefullscreen?file=src%2Fapp%2Fapp.component.ts
@HostListener('document:keydown.escape', ['$event']) onKeydownHandler(event: KeyboardEvent) {
this.closeFullscreen();
}
<ul class = "navbar-nav">
<li class = "nav-item mr-2 d-none d-lg-block">
<a *ngIf = "toggleClass === 'ft-maximize'" href = "javascript:;" class = "nav-link" (click) = "openFullscreen()">
Open
</a>
<a *ngIf = "toggleClass === 'ft-minimize'" href = "javascript:;" class = "nav-link" (click) = "closeFullscreen()">
Close
</a>
</li>
</ul>
@HienNguyen. да, он закрывается при нажатии esc, НО слово «Открыть» все еще появляется. Должно быть "Закрыть"
Я пробовал в вашем stackbliz, он показывает закрытый текст
Да, он показывает текст «Закрыть», когда вы нажимаете слово «Открыть», НО когда вы нажимаете «esc», появляется слово «Закрыть», а не «Открыть».
Не уверен, что вы сможете решить эту проблему. У меня есть такой же случай, как и у вас, и я исправляю @HostListener
, как показано ниже.
@HostListener('document:fullscreenchange', ['$event'])
@HostListener('document:webkitfullscreenchange', ['$event'])
@HostListener('document:mozfullscreenchange', ['$event'])
@HostListener('document:MSFullscreenChange', ['$event'])
fullscreenmode(){
if (this.toggleClass == 'ft-minimize'){
this.toggleClass = 'ft-maximize';
}
else{
this.toggleClass = 'ft-minimize';
}
console.info(this.toggleClass)
}
Демо: https://stackblitz.com/edit/fullscreen-closefullscreen-qbickg?file=src/app/app.component.ts
какой браузер вы использовали? Я нажимаю esc, он показывает закрыть?