添加模态作为静态函数

Question

我的app.component.ts中有这个static openModalInfo()函数：

import { Platform, ModalController } from 'ionic-angular';
export class MyApp {
static modalCtrl:ModalController;
constructor(platform: Platform, 
              statusBar: StatusBar, 
              splashScreen: SplashScreen) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      statusBar.styleDefault();
      splashScreen.hide();
    });
  }
static openModalInfo() {
    let modal = this.modalCtrl.create(ModalInfo);
    modal.present();
  }
}

这个想法是将所有modal都放在MyApp，以便我可以在发生错误时调用它：

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {MyApp} from '../../../app/app.component';//<-- add MyApp.
export class HomePage {
  constructor(public navCtrl: NavController) {
  }
onModal(){
  MyApp.openModalInfo();//<-- call this function.
}
}

但是我遇到了此错误：

./主页类主页 - 内联模板：34：6 中的错误由以下原因引起： 无法读取未定义的属性"创建">

我相信，create指的是MyApp中的this.modalCtrl.create(ModalInfo).

我该如何解决这个问题？

或者，我还能如何创建一个通用模态函数，以便我可以从任何组件调用？

Answer 1

我建议你有某种Utility提供程序类，你可以注入到任何组件中

@Injectable()
export class Utility{
  constructor(private modalCtrl: ModalController){}
  openModalInfo() {
     let modal = this.modalCtrl.create(ModalInfo);
     modal.present();
  }