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 { }