Мат-диалог не заполняет экран - Angular

Question

У меня есть карусель изображений внутри диалогового окна. Неважно, каким компонентом я кормлю мат-диалог. Они никогда не заполняют экран, поэтому я не думаю, что проблема заключается в конкретном c компоненте внутри mat-диалога.

Я хочу, чтобы он заполнил ширину 100% и height:auto, чтобы изображение подходило правильно, но, похоже, оно не работает и Понятия не имею почему.

  openImageGalleryMobile(images) {
    const imageDialogRef = this.dialog.open(ImageCarouselComponent, {
      panelClass: "matdialogStyle",
      data: { images: images},
      height: 'auto',
      width: '100%',
    });

    imageDialogRef
      .afterClosed()
      .pipe(takeUntil(this.destroy))
      .subscribe(result => { });
  }

<div id="imageSlideshow">

  <ngb-carousel *ngIf="images">
    <ng-template ngbSlide *ngFor="let image of images">
      <img src='{{image}}' alt="Random first side">

    </ng-template>

  </ngb-carousel>



</div>

Я пытался добавить .matdialogStyle в качестве нового неизмененного css класса, но проблема все еще существует. Я попытался установить ширину 100% для файла компонента css или стилей. css файл, используя класс matdialogStyle css, но он никогда не обновляется. Я ценю помощь!

Answer 1

Можете ли вы попробовать:

{
  panelClass: "matdialogStyle",
  data: { images: images},
  height: 'auto',
  minWidth: '100%',
}

, и вы можете добавить для высоты 100%:

minHeight: '100vh'