Angular PrimeNG is an open-source framework with a rich set of native Angular UI components that are used for great styling and this framework is used to make responsive websites with very much ease. In this article, we will know how to use the Properties for DynamicDialog in Angular PrimeNG.
Dialogs are containers to display content in an overlay window & can be dynamically created with any component as the content with the help of DialogService.
Angular PrimeNG Properties for DynamicDialog Properties: There are various properties options provided by Angular PrimeNG that can be utilized for the customization of theDynamic Dialog Component.
data: It is a piece of data to be passed to the Dialog’s loaded component.
header: It is text in the dialog’s header.
footer: It is text in the dialog’s footer.
width: It is the width of the dialog.
height: It is the height of the dialog.
closeOnEscape: It specifies whether the dialog should be hidden by pressing the escape key.
baseZIndex: It is the value for the base zIndex to use in layering.
autoZIndex: It is used to check whether layering should be managed automatically.
dismissableMask: It specifies whether the dialog should be hidden by clicking the modal background.
rtl: When enabled, RTL-oriented dialog is displayed.
style: It is the inline style of the component.
contentStyle: It is the content section inline style.
styleClass: It is the component’s inline style.
transitionOptions: It is the options for the animation’s transitions.
closable: It hides the dialog by adding a close icon to the header.
showHeader: It specifies whether or not to display the header.
maximizable: It specifies whether the dialog will fit on the entire screen.
minimizeIcon: It is the minimize icon’s name.
maximizeIcon: It is the maximize icon’s name.
minX: It is the lowest possible value for the dialog’s left coordinate when dragging.
minY: It is the lowest possible value for the dialog’s top coordinate when dragging.
position: It is used to set the position of the dialog. “Center,” “Top,” “Bottom,” “Left,” “Right,” “Top-Left,” “Top-Right,” “Bottom-Left,” or “Bottom-Right” are the dialog’s positions.
keepInViewport: It keeps the dialog in the viewport.
resizable: It is used to enable the resizing of the content.
draggable: It allows header dragging to change the position.
Please Login to comment...