Angular Popup Opening closing the popup Example

Use the popup to render any content or form in a modal box that can be programmatically shown or hidden. For that the open and close methods can be used.

To check whether the popup is opened or not, use the isVisible method.

Get started with this example

Javascript jQuery Angular React Vue

html<mbsc-button 
  (click)="openPopup()"> Open popup
</mbsc-button>

<mbsc-popup #popup [options]="{display: 'center'}">
  <!-- popup content -->
  <mbsc-button 
    (click)="closePopup()"> Close 
  </mbsc-button>
</mbsc-popup>
tsopenPopup(): void {
  this.popup.open();
}

closePopup(): void {
  this.popup.close();
}