イオン2ナビゲーション・ページはいけない仕事

Question

私は私の最初のイオン2アプリはちょうどチュートリアルをやって問題を抱えているイオンの公式ブログを形成し、ちょうどいけない、これは私のために働く、これが私のhome.ts

import {Page} from 'ionic-angular'; 
import {AboutPage} from '../about/about'; 

@Page({ 
    templateUrl: 'build/pages/home/home.html' 
}) 
export class HomePage { 
    aboutPage = AboutPage; 

    constructor() { 
    this.name = "Bartek"; 
    } 
} 

とこれです私のhome.htmlであり、これはちょうど次のページに私をナビゲートする必要があります

<ion-navbar *navbar> 


<ion-title> 
    Hello World 
    </ion-title> 
</ion-navbar> 

<ion-content class="home"> 
    <ion-card> 
    <ion-card-header> 
     Card Header 
    </ion-card-header> 
    <ion-card-content> 
     Hello 
     <button [navPush]="aboutPage">Go To About</button> 
    </ion-card-content> 
    </ion-card> 
</ion-content> 

が、私はCLIで「イオン・サーブ」を実行すると、これは私に

ionic $ TypeScript error: 

/home/bartomiej/Programowanie/Nauka/Ionic/helloWordl/app/pages/home/home.ts(2,25): Error TS2307: Cannot find module '../about/about'. 
TypeScript error: /home/bartomiej/Programowanie/Nauka/Ionic/helloWordl/app/pages/home/home.ts(11,8): Error TS2339: Property 'name' does not exist on type 'HomePage'. 
[20:41:16] Starting 'html'... 
[20:41:17] Finished 'html' after 770 ms 

/home/bartomiej/Programowanie/Nauka/Ionic/helloWordl/app/pages/about/about.js:1 
import {Page, NavController} from 'ionic-angular'; 
^ 
ParseError: 'import' and 'export' may appear only with 'sourceType: module' 
HTML changed: www/build/pages/about/about.html 
HTML changed: www/build/pages/home/home.html 

をそのエラーを与えます

誰かが間違っていると思っています。私はちょうど公式ブログの指示に従います。

Answer 1

[navPush]を使用する代わりにナビゲーションを行い、ボタン上で関数を呼び出すクラスで関数を作成します。また、コンストラクタ内にNavControllerを挿入する必要があります。例：

constructor(private nav: NavController){ 
} 

navigateAbout(){ 
    this.nav.push(AboutPage); 
} 

だけでやるのHTMLよりも<button (click)="navigateAbout"></button> 私はこれがより良いアプローチだと思う、プラスあなたはまだしたい場合は、代わりにHTML

でそれを持つのクラスで全体のロジックが表示されますあなたのアプローチをして、コンストラクタでNavControllerを使用してみてください。おそらく助けになります

Answer 2

あなたの変数はグローバルスペースにあります。ブロックスコープには "let"キーワードを使用します。 コンストラクタのbodyに "aboutPage"変数を配置すると、this.aboutPageのようになります。

Answer 3

これは、コンストラクタ内でNavControllerを呼び出す必要があるためです。 これは問題を解決するはずです。

import {Page} from 'ionic-angular'; 
import {AboutPage} from '../about/about'; 

@Page({ 
    templateUrl: 'build/pages/home/home.html' 
}) 
export class HomePage { 
    aboutPage = AboutPage; 

    constructor(public navCtrl: NavController) { 
    this.navCtrl; 
    this.name = "Bartek"; 
    } 
}