Angular 2: ngx-popover 按 ESC 键关闭

Question

我在组件中引用这个 ngx-popover

ngx-popover 现在的问题是如何通过按 ESC 键关闭弹出框

这是我的代码

<div style="margin-bottom: 1em;" class="comment" *ngIf="myPopover2">
                        <popover-content #myPopover2
                                         placement="left"
                                         [animation]="true"
                                         [closeOnClickOutside]="true" [ng2-draggable]="true">
                            <button class="button_close" (click)="myPopover2.hide()">
                                <i class="fa fa-chevron-right" aria-hidden="true"></i>
                            </button>
                            <comment></comment>
                        </popover-content>
                    <button [ngClass]="{'container-element': myPopover2}" type="button" (keydown)="CloseEvent($event)" class="btn btn-labeled btn-default btn-block button_style" [popover]="myPopover2">
                        </span>
                    </button>
                </div>

请帮帮我

Answer 1

  popoverVisible: boolean = true;

  constructor(@Inject(DOCUMENT) private document) {}

  @HostListener('document:keydown', ['$event'])
  handleKeyboardEvent(event: KeyboardEvent) {
    if (event.keyCode === 27) { // 27===ESC
      this.popoverVisible = false;
    }
  }

然后在弹出元素上：*ngIf="popoverVisible"

Angular 2: ngx-popover 按 ESC 键关闭

Angular 2: ngx-popover close by hitting ESC key

html

angular

angular2-template

popover