如何在离子中自定义离子select弹出高度

Question

我正在尝试覆盖 div 的 max-height ，它使用 interfaceOptions 属性对弹出窗口中的元素进行分组，但到目前为止我还没有运气，这是什么我到目前为止：

 customOptions: Record<string, string> = {
    header: this.translate.instant('mobile.giving.deductionStartDateHeader'),
    cssClass: 'ion-select-max-height'
  };

.ion-select-max-height {
 .alert-radio-group {
      max-height: 100%!important;
      }
}

<ion-select [interfaceOptions]="customOptions" [formControlName]="fields.deductionStartDate">
    <ion-select-option *ngFor='let date of company.possibleDeductionDates | slice:0:6' [value]="date">
                {{ date | date:'mediumDate' }}
    </ion-select-option>
</ion-select>

如何在不覆盖全局 classes 的情况下更改具有 class .alert-radio-group 的 div 的最大高度？

Answer 1

如果我在我创建的 class 前面使用 ng-deep 传递给 cssClass 属性，那么它会覆盖我想在弹出窗口中修改的 class：

::ng-deep .ion-select-max-height {
 .alert-radio-group {
      max-height: 100%;
      }
}

我仍在学习 angular 中的样式，但我读到 ng-deep 所做的是将样式强制到子组件，我看到 ion-alert 被注入到 DOM，所以我猜是子组件

如何在离子中自定义离子select弹出高度

How to customize ion-select popup height in ionic

javascript

css

ionic-framework

angular

ionic4