子脚本和父脚本都在同一个typescript文件中。
import { Component, Input, ChangeDetectionStrategy, OnInit, NgZone } from '@angular/core';
import { SetupItemViewArgs } from "nativescript-angular/directives";
import { Router, ActivatedRoute } from '@angular/router';
import { Observable } from 'rxjs/Observable';
import { RouterExtensions } from 'nativescript-angular/router/router-extensions';
import { FirebaseService, BackendService } from "../services";
//CHILD
@Component({
selector: 'roomrow',
template: `
<CardView class="studentCard" margin="2" elevation="10" radius="1">
<GridLayout rows="auto, auto, auto" columns="auto, auto, *">
<Label [text]="item.id" textWrap="true" stretch="aspectFill" colSpan="3" row="0"></Label>
<Label [text]="item.name" textWrap="true" row="2" colSpan="1"></Label>
</GridLayout>
</CardView>
`,
changeDetection: ChangeDetectionStrategy.OnPush
})
class RoomrowComponent {
@Input() item: any;
constructor(
private ngZone: NgZone,
) {
alert(this.item);//not called
}
}
//PARENT
@Component({
selector: 'rooms',
template: `
<StackLayout>
<ScrollView>
<StackLayout>
<StackLayout *ngFor="let item of (rooms$ | async)">
<roomrow [item]="item"></roomrow>
</StackLayout>
</StackLayout>
</ScrollView>
</StackLayout>
`,
changeDetection: ChangeDetectionStrategy.OnPush
})
export class RoomsComponent {
public rooms$: Observable<any>;
constructor(
private route: ActivatedRoute,
private ngZone: NgZone,
private routerExtensions: RouterExtensions,
private firebaseService: FirebaseService
) {
}
ngOnInit() {
this.rooms$ = <any>this.firebaseService.getPath('users/' + BackendService.token + '/rooms');
}
}