html - bootstrap dialog esc key not working -
this dialog, esc key not working, have ideas might wrong ?
<div *ngif="visible" class="overlay"> <div role="dialog" class="overlay-content" tabindex="-1"> <div class="modal-dialog" [ngclass]="{'wide-modal-dialog': widecontent}" > <!-- modal content--> <div class="modal-content"> <div class="modal-header" *ngif="header.length > 0"> <button type="button" class="close" (click)="close()" data-dismiss="modal">×</button> <h4 class="modal-title">{{ header }}</h4> </div> <div class="modal-body"> <ng-content></ng-content> </div> <div class="modal-footer footer-buttons"> <button type="button" class="btn btn-default" [disabled]="positivedisabled" (click)="confirm()">{{ positivebtnlabel }}</button> <button type="button" class="btn btn-default" (click)="close()">{{ negativebtnlabel }}</button> </div> </div> </div> </div> </div>
i not sure why doesn't work, can set listener in directive:
@directive({ selector: '[onesc]' }) export class clickoutsidedirective { constructor(private elementref: elementref) { } @output() onesc = new eventemitter<event>(); @hostlistener('window:keydown', ['$event']) onkeydown(event: keyboardevent): void { if (event.keycode === 27) { this.onesc.emit(event); } } }
and in component:
.... (onesc)=close()....
Comments
Post a Comment