Opt*_*tiq 2 typescript angular2-inputs angular
我刚刚开始使用@InputAngular 的功能,到目前为止一切都很好。我使用 Firebase 作为数据库,我调用的数据块如下所示
{
"page_area_business_image" : {
"expand" : {
"intro" : "some info...",
"title" : "a title"
},
"rebrand" : {....},
"newbrand" : {....},
"questions" : {
"question01" : {
"id" : "an ID",
"name" : "a name",
"question" : "a question",
"answers" : {
"answer01" : {
"answer" : "some answer",
"id" : "an ID"
},
"answer02" : {
"answer" : "another answer",
"id" : "an ID"
}
}
},
"question02" : {....},
"question03" : {....}
}
}
}
Run Code Online (Sandbox Code Playgroud)
我现在遇到的唯一问题是让子组件读取父组件中完全正常的questions数据console.log(),这意味着服务文件正在传递它。这就是我调用它的方式。
父组件
private busExpInformation: FirebaseObjectObservable<any>;
private busImageO: FirebaseObjectObservable<any>;
private busImageQuesO: FirebaseObjectObservable<any>;
constructor(private _homeService: HomeService) { }
ngOnInit() {
this._homeService.getBusExpInformation().subscribe(BusExpInformation =>{
this.busExpInformation = BusExpInformation;
});
this._homeService.getBusImage().subscribe(BusImage => {
this.busImageO = BusImage.expand;
this.busImageQuesO = BusImage.questions;
console.log(this.busImageQuesO); //works fine here
});
}
Run Code Online (Sandbox Code Playgroud)
父模板
<business-image [busImageI]="busImageO" [busImageQuesI]="busImageQuesO"></business-image>
Run Code Online (Sandbox Code Playgroud)
子组件
@Input('busImageI')
busImage: FirebaseObjectObservable<any>;
@Input('busImageQuesI')
questions: FirebaseObjectObservable<any>;
ngOnInit() {
console.log(this.questions);// doesn't return anything
}
Run Code Online (Sandbox Code Playgroud)
我什至回到父组件并在它自己的数据库调用中调用它,如下所示
this._homeService.getBusImage().subscribe(BusImage => {
this.busImageQuesO = BusImage.questions;
console.log(this.busImageQuesO);
});
Run Code Online (Sandbox Code Playgroud)
它对子组件仍然没有影响。通过我一直在研究的其他元素,另一个和所有其他元素一样显示得很好。
我在我遇到的一些文章和教程中看到,他们强调在父组件中导入和声明子组件,但我也看到其他人只是在主模块中声明子组件组件已链接到,这就是我的设置方式。我不知道这是否有影响。我见过导入多个@Inputs 的其他示例,但我看不出我在做什么不同。
| 归档时间: |
|
| 查看次数: |
1859 次 |
| 最近记录: |