nuiDialog ディレクティブは、ネイティブの <dialog> を Needless UI のダイアログに変えます。モーダルの動作はブラウザーが提供します。背後のページは操作できなくなり、フォーカスはダイアログ内にとどまります。Esc キーで閉じることができ、閉じるとフォーカスはダイアログを開いた要素に戻ります。
[(open)] をシグナルにバインドし、閉じるボタンに nuiDialogClose="…" で値を指定すると、ダイアログがどのように閉じられたかがわかります。
確認ダイアログ
破壊的な操作の確認です。安全な選択肢に autofocus を付け、選ばれた値は (closed) で受け取ります。
ダイアログ内のフォーム
ダイアログには任意のコンテンツを配置できます。この例では、ダイアログが開くと最初のフィールドにフォーカスが移ります。
閉じ方を限定したダイアログ
[dismissible]="false" を指定すると Esc キーと背景のクリックが無視されるため、ユーザーはいずれかの選択肢を選ぶ必要があります。