angular / angular/components

feat(dialog): Support async `MatDialogConfig.closePredicate`

オープン
#32,142 コメント 1 件 リアクション 5 件 担当者 0 名 GitHub で見る
area: material/dialog feature P3
主要言語
TypeScript
スター
25k
フォーク
6.8k
平均マージ
1日 8時間
マージ済み PR(30日)
91

説明

### Feature Description

For a long time we wanted to be able to cancel dialog closure, in #14292. It was solved via a new option, `closePredicate`, in #14292. But that new option does not support async code. And so we cannot, for example, ask user for the confirmation to close the dialog (via a second dialog), nor do XHR to verify things on server-side.

This kind of use case was already mentioned by @teolag in https://github.com/angular/components/issues/14292#issuecomment-2828734239, but that specific part of the message was left unanswered. And @Nakira had to come up with a custom solution to solve this in https://github.com/angular/components/issues/14292#issuecomment-2907749489

### Use Case

I want the dialog closure to wait until I know whether it can be closed. Possibly via asking the user that he is OK to lose all the data he just input in the dialog, like so:

```ts
this.matDialog.open(MyDialogComponent, {
closePredicate: async () => await askUserIfReallySure(),
});
```

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

既存の MatDialogConfig.closePredicate の動作とダイアログのクローズフローから始めます。issue には公開オプションと非同期の使用例が示されています。predicate の結果がどのように処理されるかを追跡し、その後、ダイアログのクローズが非同期の確認を待機し、キャンセルも引き続きサポートすることを確認します。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
angular, typescript
領域
frontend
issue の種類
機能追加
難易度
4/5
見積もり時間
3〜5日
活発さ
静か
明瞭さ
おおむね明確
初心者へのやさしさ
52/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。