Resizable angular material popup with ang-grid-angular table

I am using angular material dialog. Inside that ag-grid-angular table is there.Resizable is working but ag-grid angular table stay as it is.I want to make material popup resizable.n if we increase popup width and height accordingly table should be changed.

     <mat-icon class="close-icon" color="gray">close</mat-icon>
 </button>
 <div [class]="headLine">TittleName</div>
<div class="agTable">
 <ag-grid-angular
         class="zebra"
         singleClickEdit="true"
         [columnDefs]="columnConfig"
         [rowData]="rowData"
         [defaultColDef]="defaultColumnDefs"
         [getRowHeight]="getRowHeight"
         (gridReady)="gridReady($event)"
         (gridSizeChanged)="setColumnWidth($event)"
         [suppressContextMenu]="true"
         [enableCellTextSelection]="true">
 </ag-grid-angular>
</div>
<mat-dialog-actions align="end" class="buttonAllign">
 <button mat-button mat-dialog-close class="closeButton">close</button>
</mat-dialog-actions>```


css------------->
::ng-deep .mat-dialog-container {
resize:both;
}