Composant Modal Angular | ng-hub-ui-modal

Composant modal Angular accessible avec empilement, mode plein écran, templates, gestion du clavier et variables CSS pour les applications standalone.

Vue d’ensemble

Pourquoi les équipes recherchent cette bibliothèque

Ce composant modal Angular est conçu pour les équipes qui ont besoin de dialogues accessibles, de contenu composable, d'un contrôle piloté par service et d'un style adapté aux design systems dans les applications Angular standalone.

Installation

npm install ng-hub-ui-modal

Aller à

Idéal pour

  • dialogues de confirmation
  • formulaires en overlay
  • panneaux de détail
  • flux empilés

À propos de modal

ng-hub-ui-modal résout l'un des besoins UI les plus courants dans les produits Angular : ouvrir des dialogues qui restent robustes en production. Il couvre les modals empilés, les flux plein écran, la gestion du clavier, les projections et l'usage piloté par service sans transformer la logique modale en un problème propre à chaque projet.

Guides de fonctionnalités

Ouverture de modales (types de contenu)

Montre comment ouvrir des modales avec un contenu de type TemplateRef, Component ou String.

Configuration et options

Personnalisez l'apparence et le comportement de la modale

Référence de modale (HubModalRef)

Contrôlez et accédez à l'état des modales ouvertes

Modale active (HubActiveModal)

Interagissez avec la modale depuis son propre contenu

Gestion de la pile

Gestion de plusieurs modales empilées

Fonctionnalités clés

Changements récents

Version 21.0.2 - 3/31/26, 12:00 AM

changed: Standardized padding variables and improved fullscreen layout responsiveness.

Version 21.0.1 - 3/19/26, 12:00 AM

changed: Removed hardcoded design system token defaults from stylesheet; all --hub-modal-* variables retain literal fallback values.

fixed: Fixed modal-backdrop and modal unit test reliability.

Version 21.0.0 - 3/10/26, 12:00 AM

added: HubModalPlacement configuration for anchored modal positioning.

changed: BREAKING: Standardized CSS class names to hub-modal BEM convention.

Version 1.2.0 - 1/7/25, 12:00 AM

added: Documentation and examples update

Bibliothèques associées

ng-hub-ui-portal ng-hub-ui-utils