A callback method that is invoked immediately after the default change detector has checked the directive's data-bound properties for the first time, and before any of the view or content children have been checked. It is invoked only once when the directive is instantiated.
OptionalaccentOptionalalignOptionalalignOptionalalignOptionalalignmentOptionalall?: stringOptionalanimation?: stringOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalappearance?: stringOptionalaspectOptionalbackdropOptionalbackfaceOptionalbackground?: stringOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbaselineOptionalbaselineOptionalblockOptionalborder?: stringOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalbottom?: stringOptionalboxOptionalboxOptionalbreakOptionalbreakOptionalbreakOptionalcaptionOptionalcaretOptionalclear?: stringOptionalclip?: stringOptionalclipOptionalclipOptionalcolor?: stringOptionalcolorOptionalcolorOptionalcolorOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumns?: stringOptionalcontain?: stringOptionalcontainOptionalcontainOptionalcontainOptionalcontainOptionalcontainOptionalcontainer?: stringOptionalcontainerOptionalcontainerOptionalcontent?: stringOptionalcontentOptionalcounterOptionalcounterOptionalcounterOptionalcssOptionalcssOptionalcursor?: stringOptionalcx?: stringOptionalcy?: stringOptionald?: stringOptionaldirection?: stringOptionaldominantOptionalemptyOptionalfill?: stringOptionalfillOptionalfillOptionalfilter?: stringOptionalflex?: stringOptionalflexOptionalflexOptionalflexOptionalflexOptionalflexOptionalflexOptionalfloat?: stringOptionalfloodOptionalfloodOptionalfont?: stringOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalforcedOptionalgap?: stringOptionalgrid?: stringOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalhyphenateOptionalhyphens?: stringOptionalimageOptionalimageOptionalinlineOptionalinset?: stringOptionalinsetOptionalinsetOptionalinsetOptionalinsetOptionalinsetOptionalinsetOptionalisolation?: stringOptionaljustifyOptionaljustifyOptionaljustifyOptional Readonlylength?: numberOptionalletterOptionallightingOptionallineOptionallineOptionallistOptionallistOptionallistOptionallistOptionalmargin?: stringOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarker?: stringOptionalmarkerOptionalmarkerOptionalmarkerOptionalmask?: stringOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmathOptionalmathOptionalmaxOptionalmaxOptionalmaxOptionalmaxOptionalminOptionalminOptionalminOptionalminOptionalmixOptionalobjectOptionalobjectOptionaloffset?: stringOptionaloffsetOptionaloffsetOptionaloffsetOptionaloffsetOptionaloffsetOptionalopacity?: stringOptionalorder?: stringOptionalorphans?: stringOptionaloutline?: stringOptionaloutlineOptionaloutlineOptionaloutlineOptionaloutlineOptionaloverflow?: stringOptionaloverflowOptionaloverflowOptionaloverflowOptionaloverflowX?: stringOptionaloverflowY?: stringOptionaloverscrollOptionaloverscrollOptionaloverscrollOptionaloverscrollOptionaloverscrollOptionalpadding?: stringOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpage?: stringOptionalpageOptionalpageOptionalpageOptionalpaintOptional ReadonlyparentOptionalperspective?: stringOptionalperspectiveOptionalplaceOptionalplaceOptionalplaceOptionalpointerOptionalprintOptionalquotes?: stringOptionalr?: stringOptionalresize?: stringOptionalright?: stringOptionalrotate?: stringOptionalrowOptionalrubyOptionalrx?: stringOptionalry?: stringOptionalscale?: stringOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollbarOptionalscrollbarOptionalscrollbarOptionalshapeOptionalshapeOptionalshapeOptionalshapeOptionalstopOptionalstopOptionalstroke?: stringOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionaltabOptionaltableOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltouchOptionaltransform?: stringOptionaltransformOptionaltransformOptionaltransformOptionaltransition?: stringOptionaltransitionOptionaltransitionOptionaltransitionOptionaltransitionOptionaltransitionOptionaltranslate?: stringOptionalunicodeOptionaluserOptionalvectorOptionalverticalOptionalvisibility?: stringOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwhiteOptionalwhiteOptionalwidows?: stringOptionalwillOptionalwordOptionalwordOptionalwordOptionalwritingOptionalx?: stringOptionaly?: stringOptionalzoom?: stringOptionalaccentOptionalalignOptionalalignOptionalalignOptionalalignmentOptionalall?: stringOptionalanimation?: stringOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalanimationOptionalappearance?: stringOptionalaspectOptionalbackdropOptionalbackfaceOptionalbackground?: stringOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbackgroundOptionalbaselineOptionalbaselineOptionalblockOptionalborder?: stringOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalborderOptionalboxOptionalboxOptionalbreakOptionalbreakOptionalbreakOptionalcaptionOptionalcaretOptionalclear?: stringOptionalclip?: stringOptionalclipOptionalclipOptionalcolor?: stringOptionalcolorOptionalcolorOptionalcolorOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumnOptionalcolumns?: stringOptionalcontain?: stringOptionalcontainOptionalcontainOptionalcontainOptionalcontainOptionalcontainOptionalcontainer?: stringOptionalcontainerOptionalcontainerOptionalcontent?: stringOptionalcontentOptionalcounterOptionalcounterOptionalcounterOptionalcssOptionalcssOptionalcursor?: stringOptionalcx?: stringOptionalcy?: stringOptionald?: stringOptionaldirection?: stringOptionaldisplay?: stringOptionaldominantOptionalemptyOptionalfill?: stringOptionalfillOptionalfillOptionalfilter?: stringOptionalflex?: stringOptionalflexOptionalflexOptionalflexOptionalflexOptionalflexOptionalflexOptionalfloat?: stringOptionalfloodOptionalfloodOptionalfont?: stringOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalfontOptionalforcedOptionalgap?: stringOptionalgrid?: stringOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalgridOptionalheight?: stringOptionalhyphenateOptionalhyphens?: stringOptionalimageOptionalimageOptionalinlineOptionalinset?: stringOptionalinsetOptionalinsetOptionalinsetOptionalinsetOptionalinsetOptionalinsetOptionalisolation?: stringOptionaljustifyOptionaljustifyOptionaljustifyOptional Readonlylength?: numberOptionalletterOptionallightingOptionallineOptionallineOptionallistOptionallistOptionallistOptionallistOptionalmargin?: stringOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarginOptionalmarker?: stringOptionalmarkerOptionalmarkerOptionalmarkerOptionalmask?: stringOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmaskOptionalmathOptionalmathOptionalmaxOptionalmaxOptionalmaxOptionalminOptionalminOptionalminOptionalminOptionalmixOptionalobjectOptionalobjectOptionaloffset?: stringOptionaloffsetOptionaloffsetOptionaloffsetOptionaloffsetOptionaloffsetOptionalopacity?: stringOptionalorder?: stringOptionalorphans?: stringOptionaloutline?: stringOptionaloutlineOptionaloutlineOptionaloutlineOptionaloutlineOptionaloverflow?: stringOptionaloverflowOptionaloverflowOptionaloverflowOptionaloverflowX?: stringOptionaloverscrollOptionaloverscrollOptionaloverscrollOptionaloverscrollOptionaloverscrollOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpaddingOptionalpage?: stringOptionalpageOptionalpageOptionalpageOptionalpaintOptional ReadonlyparentOptionalperspective?: stringOptionalperspectiveOptionalplaceOptionalplaceOptionalplaceOptionalpointerOptionalprintOptionalquotes?: stringOptionalr?: stringOptionalresize?: stringOptionalrotate?: stringOptionalrowOptionalrubyOptionalrx?: stringOptionalry?: stringOptionalscale?: stringOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollOptionalscrollbarOptionalscrollbarOptionalscrollbarOptionalshapeOptionalshapeOptionalshapeOptionalshapeOptionalstopOptionalstopOptionalstroke?: stringOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionalstrokeOptionaltabOptionaltableOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltextOptionaltouchOptionaltransform?: stringOptionaltransformOptionaltransformOptionaltransformOptionaltransition?: stringOptionaltransitionOptionaltransitionOptionaltransitionOptionaltransitionOptionaltransitionOptionaltranslate?: stringOptionalunicodeOptionaluserOptionalvectorOptionalverticalOptionalvisibility?: stringOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwebkitOptionalwhiteOptionalwhiteOptionalwidows?: stringOptionalwillOptionalwordOptionalwordOptionalwordOptionalwritingOptionalx?: stringOptionaly?: stringOptionalzOptionalzoom?: stringOptionaloverlayOptionalcontentOptionalcustom
WaitingRoomModal - Modal for managing participants waiting to join the session
Component
Description
Displays participants in the waiting room and allows host to admit or reject them. Provides filtering and batch admission capabilities.
Supports three levels of customization:
Key Features:
Example
Basic Usage:
Example
Style Customization:
Example
Custom Template Override:
Selector
app-waiting-room-modal
Standalone
true
Imports
CommonModule, FontAwesomeModule, FormsModule
Input
isWaitingModalVisible - Whether the modal is currently visible. Default:
falseInput
onWaitingRoomClose - Callback function to close the modal. Default:
() => {}Input
waitingRoomCounter - Number of participants in waiting room (for badge). Default:
0Input
onWaitingRoomFilterChange - Callback when filter input changes. Default:
() => {}Input
waitingRoomList - Array of waiting participant objects. Default:
[]Input
updateWaitingList - Function to update the waiting list state. Default:
() => {}Input
roomName - Name of the room/session. Default:
''Input
socket - Socket.io client instance for real-time communication. Default:
undefinedInput
position - Modal position on screen ('topRight', 'center', etc.). Default:
'topRight'Input
backgroundColor - Background color of the modal content. Default:
'#83c0e9'Input
parameters - Additional parameters including filtered waiting list. Default:
{}Input
onWaitingRoomItemPress - Callback when admit/reject action is pressed. Default:
respondToWaitingService.respondToWaitingInput
overlayStyle - Custom CSS styles for the modal overlay backdrop. Default:
undefinedInput
contentStyle - Custom CSS styles for the modal content container. Default:
undefinedInput
customTemplate - Custom TemplateRef to completely replace default modal template. Default:
undefinedMethod
ngOnInit - Initializes component and default styles
Method
ngOnChanges - Updates waiting list when inputs change
Method
updateParameters - Refreshes filtered waiting list from parameters
Method
handleModalClose - Closes modal via onWaitingRoomClose callback
Method
handleFilterChange - Filters waiting list based on search input
Method
handleItemPress - Handles admit/reject actions for waiting participants
Method
getCombinedOverlayStyle - Merges default and custom overlay styles
Method
getCombinedContentStyle - Merges default and custom content styles
Getter
modalContainerStyle - Returns computed overlay styles
Getter
modalContentStyle - Returns computed content styles
Getter
inputStyle - Returns filter input field styles