angular2 ons-navigator

angular2 ons-navigator ons-carouselを使ったページを作成していますが、以下の構成で実行すると*ngForが展開されません。

app.ts

@Component({
    selector: 'app',
    template: '<ons-navigator #myNavigator [page]="page"></ons-navigator>
})
export class MyApp implements OnInit {
    page = defaultPageComponent;
    constructor(private storeService: StoreService) {}
    ngOnInit() {
        this.storeService.init(); // Httpによるデータ取得　store初期化
    }
}

defaultPageComponent.ts

@Component({
    selector: 'ons-page',
    template: `
        <ons-carousel>
            <ons-carousel-item *ngFor="let item of storeService.data">
                <div>{{item}}</div>
            </ons-carousel-item>
        </ons-carousel>
    `
})
export class DefaultPageComponent {
    constructor(private storeService: StoreService) {}
}

デベロッパーツールで確認したところ、ngForの箇所でtemplate bindings = {}となっており、storeService初期化後のデータでレンダリングしてなさそうな感じです。storeService初期化のタイミングなんでしょうか。storeServiceの値が変わったタイミングでデータバインディングされない？
でも、この状態でブラウザをリロードするとngForが展開され、ons-carousel-itemが表示されます。デベロッパーツールで確認すると、template bindings=[Object object,Object object....]となっており、storeService初期化後のデータでデータバインディングできているようです。
初回からしっかり表示させる方法を教えていただければと思います。

試したことですが、app.ts内の

template: '<ons-navigator></ons-navigator>'

この中に直接defaultPageComponentのtemplate内容を書くと正常にデータバインディングができます。
この状態で作成しようと、ons-navigator初期ページはそのままapp.tsのtemplate内に書き、navigator.pushpage()によるページ遷移はons-templateを使い、id属性でページを指定する方法で進めたのですが、今度はons-navigator要素を取得後、pushPageで他のページを表示した時にコンソールに「そんなfactoryはありません。」とエラー、navigator.pushPage()で遷移するページだけコンポーネントにして、渡すそうとすると、angular2 onsenuiでは、ons-pageをコンポーネントのselectorに指定しなければならないようで、今度はapp.ts内に描かれているons-pageがうまく表示されません。

このons-navigator ons-carousel の構成でうまい方法はありませんか。

本当はdefaultPageComponentにMyAppから値を渡してデータバインディングがしたいのすが、onsen-ui angular2リファレンスの上記方法だと、defaultPageComponentへの値の渡し方がわかりません。@Inputも試しましたが、値が渡せません。
この値の渡し方も教えていただければと思います。