Ionic 3 не может изменить размер модального

Question

Я пытаюсь изменить модальный размер, чтобы не быть полноэкранным. Я перешел по этой ссылке . Не работаетМодал все еще в натуральную величину. Вот как я открываю модальное окно:

private presentModal() {
 let profileModal = this.modalController.create(AddToCustomListModal, {cssClass: 'my-modal'});
 profileModal.present();
}

Моя модальная страница:

@IonicPage()
@Component({
  selector: 'page-add-to-custom-list',
  templateUrl: 'add-to-custom-list.html',
})
export class AddToCustomListModal {

  constructor(public navCtrl: NavController, public navParams: NavParams) {
  }

}

HTML-код моего модального сообщения, просто общий пример выбора ионов:

<ion-content padding>

  <ion-item-group>
    <ion-item>
      <ion-label>Period</ion-label>
      <ion-select>
        <ion-option value="7day">7 days</ion-option>
        <ion-option value="overall" selected="true">overall</ion-option>
      </ion-select>
    </ion-item>
  </ion-item-group>

</ion-content>

И мой глобальный файл app.scss:

.my-modal {
    background: rgba(0, 0, 0, 0.5) !important;
    padding: 20% 10%  !important;
}

Я также попытался поместить код CSS в файл scss страницы, но без разницы.

Answer 1

Попробуйте это.

private presentModal() {
 let profileModal = this.modalController.create(AddToCustomListModal, null, {cssClass: 'my-modal'});
 profileModal.present();
}

ModalController.create принимает 3 аргумента.

1. компонент
2. данные
3. опция

Если вам нужно установить cssClass, его следует отправить как opts .