Ionic 4 对 ion-Modal 进行了 更改 致使 viewController 不能 够在 @Ionic/angular 中声明.对于 模态窗的关闭按钮 ,可以直接在 import { ModalController } from "@ionic/angular";
进行 dismiss()
;
以下看图:
这个页面为 视图 View 页面 只显示出 点击按钮
import { Component, OnInit } from '@angular/core';
import { ModalController } from '@ionic/angular';
import { LoginComponent } from './login.component';
@Component({
selector: 'app-demo11-modal',
templateUrl: './demo11-modal.page.html',
styleUrls: ['./demo11-modal.page.scss'],
})
export class Demo11ModalPage implements OnInit {
constructor(private myModalCtrl: ModalController) { }
ngOnInit() {
}
// 点击 显示自定义的模态窗
async showMyModal() {
const modal = await this.myModalCtrl.create({
component: LoginComponent,
componentProps: {
componentProps: { value: 123 }
}
});
await modal.present();
}
}
下面这个为 模态窗 页面
import { Component, OnInit } from '@angular/core';
import { ModalController } from "@ionic/angular";
@Component({
selector: 'myLogin',
templateUrl: './login.component.html'
})
export class LoginComponent implements OnInit {
constructor(private myModalCtrl: ModalController) {
}
ngOnInit() { }
// 关闭我们的模态窗
closeModal() {
this.myModalCtrl.dismiss();
}
}