如何根据对话框内容中使用的下拉组件调整angular-material2的md-dialog-container的大小

Question

I am using Angular Material2's dialog component. Inside dialog, I am using input fields and angular2-dropdown-multiselect .

Now when I open drop down, it adds the scrollbar to the dialog box.

I want to get dialog should resize automatically rather than providing the scroll bar if I open multi-select dropdown.

I have tried giving max-height property to dialog box, but not working :(

Answer 1

Add a click event to your search element:

<div class="form-group" (click)="autoScroll($event)">
    <ss-multiselect-dropdown></ss-multiselect-dropdown>
</div>

In controller:

autoScroll(event): void {
  let parent = document.getElementById("ng2Dialog");
  parent.scroll(0, event.target.getBoundingClientRect().top);
}

You can change parent with Angular Material2's dialog.