Ionic 2 Modal无法正确显示

Question

我试图测试显示在Ionic 2中的模式在example on the website之后但是我得到的模式显示为灰色叠加而没有内容。 （如图所示）。 该项目创建使用ionic start demo1 sidemenu --v2

我只是想显示模式，当点击按钮。

调用页面...

import { Component } from '@angular/core'; 
import { ModalController } from 'ionic-angular'; 
import { MyModal } from './modal/modal' 

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

    constructor(public modalCtrl: ModalController) { 
    } 
    presentModal() { 
    let myModal = this.modalCtrl.create(MyModal); 
    myModal.present(); 
    } 

}

莫代尔页...

import { Component } from '@angular/core'; 
import { NavParams, ViewController } from 'ionic-angular'; 

@Component({ 
    template: ` 
<ion-content> 
    <h1>Hello</h1> 
</ion-content>> 
    ` 
}) 
export class MyModal { 

    constructor(public viewCtrl: ViewController, private params: NavParams) { 
    } 
} 

这在Chrome和MS边缘rendeing这样。但是，如果窗户缩小到一定的尺寸，灰色区域消失，但仍然没有内容。

有什么我失踪或这是一个已知的问题？

Answer 1

我设法解决这个问题。

问题是，模态分量没有在应用程序模块文件中定义...

所以我要MyModal添加到declarations和entryComponents藏品都

import { NgModule } from '@angular/core'; 
import { IonicApp, IonicModule } from 'ionic-angular'; 
import { MyApp } from './app.component'; 
import { Page1 } from '../pages/page1/page1'; 
import { Page2 } from '../pages/page2/page2'; 
import { MyModal } from '../pages/page1/modal/modal'; 

@NgModule({ 
    declarations: [ 
    MyApp, 
    Page1, 
    Page2, 
    MyModal 
    ], 
    imports: [ 
    IonicModule.forRoot(MyApp) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    Page1, 
    Page2, 
    MyModal 
    ], 
    providers: [] 
}) 
export class AppModule { }