大佬教程收集整理的这篇文章主要介绍了angular-ng-bootstrap模式在交叉点击时不关闭,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
这是< a>.触发弹出窗口的标签 –
<div class="actions padding-zero"> <a href="javascript:void(0);" (click)="openFilter()" class="icon configure-columns-icon"> <span class="control-label">Configure Columns</span> </a> </div>
莫代尔 –
<ng-template #filterForm let-modal> <div class="TitlePanel"> Configure Columns <button type="button" class="close" aria-label="Close" (click)="modal.dismiss('Cross click')"> X </button> </div> <div class="modal-body"> Body </div> </ng-template>
component.ts文件 –
export class NgbdModalContent { @input() name; constructor(public activeModal: NgbActiveModal) { } } @Component({ selector: 'app-modals',templateUrl: './modals.component.html',styleUrls: ['./modals.component.scss'],encapsulation: ViewEncapsulation.None,}) export class ModalsComponent { closeResult: string; constructor(private modalService: NgbModal) { } // Open default modal open(content) { this.modalService.open(content).result.then((result) => { this.closeResult = `Closed with: ${result}`; },(reason) => { this.closeResult = `Dismissed ${this.getDismissReason(reason)}`; }); } // This function is used in open private getDismissReason(reason: any): string { if (reason === ModalDismissReasons.ESC) { return 'by pressing ESC'; } else if (reason === ModalDismissReasons.BACKDROP_CLICK) { return 'by clicking on a backdrop'; } else { return `with: ${reason}`; } } // Open modal with dark section openModal(customContent) { this.modalService.open(customContent,{ windowClass: 'dark-modal' }); } // Open content with dark section openContent() { const modalRef = this.modalService.open(NgbdModalContent); modalRef.componentInstance.name = 'World'; } }
<ng-template #filterForm let-d="dismiss"> <div class="TitlePanel"> Configure Columns <button type="button" class="close" aria-label="Close" (click)="d('Cross click')"> X </button> </div> <div class="modal-body"> Body </div> </ng-template>
以上是大佬教程为你收集整理的angular-ng-bootstrap模式在交叉点击时不关闭全部内容,希望文章能够帮你解决angular-ng-bootstrap模式在交叉点击时不关闭所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。