javascript - 如何在 Ionic 2 中动态创建具有特定类的模态？

Question

嗨，我已经被一个问题困了好几天了，到目前为止还没有任何研究证明是充分的。我正在尝试在 Ionic 2 中创建一个具有特定类(或 ID)的简单模态。

我需要像这样简单的东西:

<ion-modal class="myDifficultToAddClass">
...
</ion-modal>

这是我的代码:

import { NavParams, ModalController } from 'ionic-angular';
@Component(...)
class PageBehindTheModal {
  constructor(public modalCtrl: ModalController) {

  }
  presentProfileModal() {
    let profileModal = this.modalCtrl.create(Profile, { randomData: randomData });
    profileModal.present();
  }
}

@Component(...)
class Profile {
  constructor(params: NavParams) {
    console.log('Some info: ', params.get('randomData'));
  }
}

我已经尝试使用来自 angular/core 的 ViewEncapsulation 来封装 View ，以便使用本地 css，但是这个 css 将在全局范围内可用(而且我不能只“设计”这个特定的模态 - 所以这不是一个解决方案) :

import { ViewEncapsulation } from '@angular/core';
@Component({
  styleUrls: ['./product-details.scss'],
  encapsulation: ViewEncapsulation.Emulated
})

我希望找到一个简单的解决方案，例如:

// create(component, data, opts)
create(Profile, { randomData: randomData }, { cssClass: 'myDifficultToAddClass' })

不幸的是，我的愿望没有实现:)。

有人知道怎么做吗？

Answer 1

您现在可以在创建模式时将 CSS 类名作为可选参数传递。

  presentProfileModal() {
    let profileModal = this.modalCtrl.create(Profile, { 
      randomData: randomData }, {
      cssClass: 'myDifficultToAddClass'
    });
    profileModal.present();
  }

找官方文档here