Press "Enter" to skip to content

Angular Custom Modal Dialog with Inner Component Support

angular-custom-modal is a nice clean Angular2+ window and dialog element with built-in component support.

angular create modal component, angular modal dialog example, angular open modal from component, angular reusable modal components

Features

Core:

  • Highlights: No CSS/JS frameworks attached
  • Compatible with Bootstrap 3 & 4 CSS
  • Custom modal head, body, and head
  • Conditional stacking support
  • Initialize the lazy internal component, and ngOnDestroy (ed) when closing arguments

Minor:

  • Optional CSS Animation
  • Parent optional pass when modal is visible
  • Escape or button to close the modal

How to make use of it:

Install

npm install angular-custom-modal

Usage

imports: [
  ...
  ModalModule,
  ...
],
...
})
<button (click)="htmlInsideModal.open()">Raw HTML inside modal</button>
<modal #htmlInsideModal>
  <ng-template #modalHeader><h2>HTML inside modal</h2></ng-template>
  <ng-template #modalBody>
    <p>HTML content inside modal</p>
  </ng-template>
</modal>

angular custom modal component Plugin/Github


See Demo And Download

Official Website(zurfyx): Click Here

This superior jQuery/javascript plugin is developed by zurfyx. For extra advanced usage, please go to the official website.

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *