web-dev-qa-db-ja.com

Ionic 4 Angular-モーダルを自己却下する方法

Ionic 3では、モーダルを閉じるのは非常に簡単でした：

constructor(viewCtrl: ViewController) {
    this.viewCtrl.dismiss()
}

Ionic 4では、ViewControllerをインポートできません（正確には、私のIDEはViewControllerのタイプをインポートしようとします）。

モーダルを却下する新しいアプローチは何だろうと思っていました。

angularionic-frameworkionic4
9
Eliya Cohen

ドキュメントによると、dismissメソッドは ModalController に移動したようです。

したがって、モーダルを却下するには、次の操作を行う必要があります。

constructor(modalCtrl: ModalController) {
  modalCtrl.dismiss();
}

質問を投稿した後、答えを見つけるのは皮肉なことです。

19
Eliya Cohen

ionic v4のドキュメントはここにありませんが、モーダルからdismissにアクセスする正しい方法は次のとおりです。

import { Components } from '@ionic/core';

@Component({
  selector: 'app-some-modal',
  templateUrl: 'some-modal.component.html',
  styleUrls: ['some-modal.component.scss']
})
export class SomeModalComponent {
  // modal is available here where created with:
  // modalController.create({ component: SomeModalComponent})
  @Input() modal: Components.IonModal;

  onCancel = () =>
    this.modal.dismiss('cancel');
}

modalは実際にはHTMLIonModalElement型です。私はComponents.IonModalHTMLIonModalElementはグローバルであるはずですが、何らかの理由でWebStorm/IntelliJからは見えません。

7
ciekawy