Angular NgbModal，如何正確關閉模態 window？

Question

我正在使用NgbModal處理模態的 Angular 應用程序。 我對如何正確關閉使用此組件實現的模態有一些疑問（直到現在我一直使用 PrimeNg 而不是ng-bootstrap ）。

基本上我已經這樣做了（而且它似乎工作正常）：在我的 TypeScript 代碼中我有這樣的東西：

async post(): Promise<void> {
    this.submitted.next(true);
    try {
      await this.setAddress();
      this.modalService.dismissAll();
    } catch (e) {
      console.error('Storage upload error', e);
      this.submitted.next(false);
    }
}

基本上，當提交帖子時會調用此方法。 setAddress()方法將表單值保存在數據庫中（調用另一個服務方法）。 然后模態被關閉。 它似乎工作正常，但我有以下疑問：

正如您所看到的，為了關閉我的模式，我使用了這個dismissAll()方法。 檢查文檔： https://ng-bootstrap.github.io/#/components/modal/api

它還表示我不能在我的代碼上使用的close()方法。 試：

this.modalService.close();

IDE 對我說：

類型“NgbModal”.ts(2339) 上不存在屬性“關閉”

為什么在官方文檔中我有這個方法但在我的代碼中沒有？ 第一個使用的方法（ dismissAll() ）是否正確？ 它正在工作，但我對方法名稱中的“全部”有一些疑問。 為什么是“全部”？ 它讓我認為它正在關閉所有模式，而不僅僅是一個模式（在我的頁面中的用例中，只有一個模式，所以它無所謂，但我不確定我是否正在實施正確的邏輯來關閉我的模態）

Answer 1

您可能正在尋找此class 的close方法。 您需要將NgbActiveModal注入組件而不是NgbModal服務。

我使用close方法優雅地關閉模式。 當你想向開啟者返回錯誤時，你可以使用dismiss方法，當有多個活動模式實例時，你可以使用dismissAll 。

Answer 2

您必須設置打開模式的參考

喜歡

this.modalReference = this.modalService.open(modalComponent);

然后關閉

this.modalReference.close();