網站搜尋

typescript - 在 Angular 4 中禁用點擊 Bootstrap 模態框外部區域來關閉模態框


我在 Angular4 中是新手。我在項目中使用了 Bootstrap 模態框。當點擊模態框外部時,模態框會隱藏。這是我的代碼

//在 HTML 中

<div bsModal #noticeModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" 
    aria-labelledby="myLargeModalLabel"
    aria-hidden="true">

    <div class="modal-dialog modal-md">
        <div class="modal-content">
              Hello World
        </div>
    </div>
</div>

// 在 ts 代碼中

@ViewChild('noticeModal') public noticeModal: ModalDirective;

ngAfterViewInit() {
   this.noticeModal.show();
};

答案#1

請將此配置添加到 HTML 中。希望能幫助解決你的問題。

<div bsModal #noticeModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" 
    [config]="{backdrop: 'static',  keyboard: false}" 
    aria-labelledby="myLargeModalLabel"
    aria-hidden="true">

    <div class="modal-dialog modal-md">
        <div class="modal-content">
              Hello World
        </div>
    </div>
</div>