0
Ionic 2 Rc2を使用しています。私は、アプリケーション内のすべてのページ用にカスタムのナビゲーションバーを作成したいと思います。このナビゲーションバーのタイトルは、ページごとに変更する必要があります。私はnavbar.tsとnavbar.htmlを作成しました。私のアプリケーションはエラーなく動作します。
home.htmlで<navbar [pageTitle]="1" ></navbar>
を使用すると、pageTitleは1に設定されます。ただし、home.htmlで<navbar [pageTitle]="home page" ></navbar>
を使用すると、pageTitleの結果は未定義です。イオン2 - カスタムコンポーネント@入力が正しく機能しない
Navbar.ts
import { Component,Input } from '@angular/core';
import { NavController } from 'ionic-angular';
@Component({
selector: 'navbar',
templateUrl: 'navbar.html'
})
export class CustomNavbar {
@Input()
public pageTitle : string;
constructor(public navCtrl: NavController) {
console.log(this.pageTitle);
}
}
navbar.html
<ion-header>
<ion-toolbar color="primary" no-border-bottom>
<ion-buttons left>
<button ion-button>
<ion-icon name="contact"></ion-icon>
</button>
</ion-buttons>
<ion-title >{{pageTitle}}</ion-title>
<ion-buttons right>
<button ion-button>
<ion-icon name="options"></ion-icon>
</button>
</ion-buttons>
</ion-toolbar>
</ion-header>
home.html
<navbar [pageTitle]="Home Page" ></navbar>
<ion-content padding>
welcome
</ion-content>
この場合、未定義PAGETITLE戻ります。どんな解決策ですか?ありがとう。
も
または
を参照してくださいする必要がありますねなぜそれが価値があるのかは不明です。それをngOnInit(){}内で呼び出す – Manish
は、レンダリングされたテンプレートで定義されていないか、 'console.log'でのみ定義されていますか? – Sefa
console.logの結果は未定義で、ページタイトルはレンダリングされたテンプレートには表示されません。 –