Any way to control class="modal-dialog" & class="modal-content" in BsModalService ?

Actually I am searching for way to get control over class="modal-dialog" & class="modal-content" while opening modal by using BsModalService.

My application has different type of modal with different size of height width. In Angular 1.5.x we were sending modal configurable option and add them accordingly in windowTemplateUrl file.Now, I am trying to implement same configurability in ngx-bootstrap-modal.

In Angular 1.5.x we were using ui.bootstrap.modal

I found that BsModalService place dynamic component within modal-content div.

<div class="modal-dialog">

<div class="modal-content">
	<app-modal-content-component></app-modal-content-component>
</div>

</div>

Due to this, there is no way to control over these two parent div.

I supposed to add height,width,header title in dynamic way by passing from hosting controller. I would also like to add modal draggability in class="modal-content"

[IlyaSurmay]

You can add another css class to modal: this.modalService.show(Component, {class: 'modal-lg'})); and after that you’ll be able to control width, height, position, etc. If you want to fully control modal template, use directive instead of service

[AbhijitMuke]

You can override all modal related classes in your component SCSS file by adding encapsulation: ViewEncapsulation.None to your modal component under @Component decorator.

Use your style with modal class name like - modal-content modal modal-header