Ionic2：次のページを開くことができません：コンポーネントファクトリが見つかりません

Question

私はionic2を使用して最初のアプリケーションを開発しようとしています。私は最初のページを始めるとすべて正常に動作し、次に2番目のページを追加することにしました。問題に直面しました。私は次のページを開く必要があり、ボタンをクリックすると、それがロードされますが、次のエラーとされています

Runtime Error

Error in ./NewsHeadline class NewsHeadline - inline template:7:1 caused by: No component factory found for NewsPage

Stack

Error: No component factory found for NewsPage ...

Ionic Framework: 2.0.0 
Ionic Native: 2.4.1 
Ionic App Scripts: 1.0.0 
Angular Core: 2.2.1 
Angular Compiler CLI: 2.2.1 
Node: 6.9.4 
OS Platform: Linux 4.4 
Navigator Platform: Win32 
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 

しかし、私はニュースページ宣言が欠落している場所を正確に理解してdont't。

これはニュース-page.tsは、単純に次のコードを含んでいるが、これは私の私のapp.modules.ts

import { NgModule, ErrorHandler } from '@angular/core'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { MyApp } from './app.component'; 
import { AboutPage } from '../pages/about/about'; 
import { ContactPage } from '../pages/contact/contact'; 
import { HomePage } from '../pages/home/home'; 
import { TabsPage } from '../pages/tabs/tabs'; 

import {NewsHeadline} from '../components/news/newsHeadline'; 

@NgModule({ 
    declarations: [ 
     MyApp, 
     AboutPage, 
     ContactPage, 
     HomePage, 
     TabsPage, 
     NewsHeadline 
    ], 
    imports: [ 
     IonicModule.forRoot(MyApp) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
     MyApp, 
     AboutPage, 
     ContactPage, 
     HomePage, 
     TabsPage 
    ], 
    providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}] 
}) 

export class AppModule {} 

ある

<ion-header> 
    <ion-navbar> 
    <ion-title>Home</ion-title> 
    </ion-navbar> 
</ion-header> 

<ion-content padding> 
<ion-list> 
    <h2 class="center">mY FIRST List</h2> 
    <ion-list> 
    <news-headline *ngFor="let notice of newsList" [news]="notice"> 
    </news-headline> 
</ion-list> 
</ion-list> 
</ion-content> 

私home.htmlです：

import { Component } from '@angular/core'; 
import { NavParams } from 'ionic-angular'; 
import {News} from '../../components/news/news'; 

@Component({ 
    selector: 'page-news-page', 
    templateUrl: 'news-page.html' 
}) 
export class NewsPage { 
    news: News; 

    constructor(navParams: NavParams) { 
     this.news = navParams.data; 
    } 
} 

を

したがって、問題の核心はnewsHeadline.tsファイルにあり、次のコードが含まれています。

import {Component, Input} from '@angular/core'; 
import {News} from './news'; 
import {NewsPage} from '../../pages/news-page/news-page'; 
import { NavController } from 'ionic-angular'; 

@Component({ 
    selector: 'news-headline', 
    template: ` 
<ion-item> 
    <ion-thumbnail item-left> 
     <img src="{{news.imagePreviewUrl}}"> 
    </ion-thumbnail> 
    <h2>{{news.title}}</h2> 
    <p>{{news.date | date: 'dd/MM/yyyy'}}</p> 
    <button clear item-right (click)="goToNews(news)">Leggi</button> 
</ion-item>` 
}) 
export class NewsHeadline { 
    @Input() 
    news: News; 
    constructor(public navCtrl: NavController) {}  

    goToNews(news: News) { 
     this.navCtrl.push(NewsPage, news); 
    } 
} 

Answer 1

宣言とentryComponentsの両方にNewsPageを追加する必要があります。新しいページを作成するたびにこれを行う必要があります。

UPDATE

What is difference between declarations, providers and import in NgModule