ionic2:如何从另一个页面中删除模态

时间:2017-08-27 13:20:22

标签: ionic-framework ionic2

我正在使用Ionic2,我想将模态设置到页面的中心,当点击打开模态时,我希望其他页面的不透明度为0.7,当点击任何模式时,这是我的Html代码:< / p>

<ion-header>
<ion-navbar color="dark">
    <button ion-button icon-only menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>

    <ion-title>Product</ion-title>
    <ion-buttons end mode="md" (click)="sharePost()">
        <button ion-button icon-only no-padding no-margin>
            <ion-icon name="md-share"></ion-icon>
        </button>
    </ion-buttons>

</ion-navbar>

</ion-header>


<ion-content id="body" (click)="closeModal()">

</ion-content>

.ts

import { ReviewPage } from '../review/review';
import { DescriptionPage } from '../description/description';
import { Component, ViewChild } from '@angular/core';
import { ModalController, NavController, NavParams, PopoverController, 
ViewController } from 'ionic-angular';
import { ShareOptionsPage } from '../share-options/share-options';

@Component({
 selector: 'page-product',
 templateUrl: 'product.html',
})
export class ProductPage {

contactModal;
firstViewCtrl;

constructor(public modalCtrl: ModalController,public navCtrl: 
 NavController, public navParams: NavParams,public popoverCtrl: 
 PopoverController,public viewCtr:ViewController) {
}

sharePost() {
 this.contactModal = this.modalCtrl.create(ShareOptionsPage, 
  {showBackdrop: true, enableBackdropDismiss: true});
 this.contactModal.present();
 this.firstViewCtrl = this.navCtrl.first();
}

closeModal() {

 if(this.contactModal != null) {
  this.firstViewCtrl.dismiss()
 }
}
}

但它不起作用,我该怎么办?

1 个答案:

答案 0 :(得分:1)

如果您的意思是如何从另一个页面中解除模态,那么您可以在模态页面或其他页面(私有viewCtrl:ViewController)中注入ViewController,然后调用viewCtrl.dismiss()

如果您打算如何更改不透明度,那么在模态选项中您可以设置自己定义的css类。

希望有所帮助。