Die Direktive nuiDialog macht aus einem nativen <dialog> einen Dialog von Needless UI. Das modale Verhalten liefert der Browser: Die Seite dahinter wird inert, der Fokus bleibt im Dialog, Esc schließt ihn, und der Fokus kehrt zum auslösenden Element zurück.
Binde [(open)] an ein Signal und gib Schließen-Buttons mit nuiDialogClose="…" einen Wert, um zu erfahren, wie der Dialog geschlossen wurde.
Bestätigung
Eine Bestätigung für eine destruktive Aktion. Die sichere Option hat autofocus, und der gewählte Wert kommt über (closed) an.
Formular im Dialog
Ein Dialog kann beliebige Inhalte enthalten. Hier erhält das erste Feld beim Öffnen den Fokus.
Erzwungene Auswahl
Mit [dismissible]="false" werden Esc und Klicks auf den Backdrop ignoriert: Es muss eine Option gewählt werden.
Eingangsanimationen
Jeder Button öffnet denselben Dialog mit einem anderen enter-Preset und der Feder bouncy. Egal, wie er erscheint: Er verschwindet mit einem schnellen Ausblenden.