ModalComponent

The Modal component displays its content in an overlay. The modal can be closed with a close button, if the user clicks outside of the modal content, or if the escape button is pressed. The modal can also be closed from outside.

Basic usage

This example shows how to use the modal component

Example 1 - simple modal:

<stream-modal [(isOpen)]="isModalOpen">
  <!-- Modal content here -->
</stream-modal>

Customization

You can provide your own modal component by the CustomTemplatesService

Inputs and outputs

isOpen

• isOpen: boolean = false

If true the modal will be displayed, if false the modal will be hidden

Defined in

projects/stream-chat-angular/src/lib/modal/modal.component.ts:25

content

• content: undefined | TemplateRef<void>

The content of the modal (can also be provided using ng-content)

Defined in

projects/stream-chat-angular/src/lib/modal/modal.component.ts:29

isOpenChange

• Readonly isOpenChange: EventEmitter<boolean>

Emits true if the modal becomes visible, and false if the modal is closed.

Defined in

projects/stream-chat-angular/src/lib/modal/modal.component.ts:33