その console.logsを介して子コンポーネントに配信されるデータのチャンクがありますが@Input
、データを操作すると、アクセスしようとしているオブジェクトが type に存在しないというエラーがスローされますFirebaseObjectObservable<any>
。
データのチャンクがどのように構造化されているかを次に示します
"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" : {....}
}
子コンポーネント内では、このように配信されています
@Input('busImageQuesI')
questions: FirebaseObjectObservable<any>; // console.logs the questions showing they made it safely to the component.
この子コンポーネントは、他の親コンポーネントで使用され、呼び出された親コンポーネントに応じて設定する独自の子コンポーネントがあります。これまでのところ、if ステートメントを使用して、表示されるデータのセットを決定すると考えました。ここまではこんな感じ
expbTrigger: boolean = false;
rebbTrigger: boolean = false;
newbTrigger: boolean = false;
ngOnInit() {
var myLocation = window.location.pathname;
if (myLocation.includes('expand')){
this.expbTrigger = true;
} else if (myLocation.includes('recreate')){
this.rebbTrigger = true;
} else if (myLocation.includes('new-business')){
this.newbTrigger = true;
}
console.log(this.expbTrigger, this.rebbTrigger, this.newbTrigger);
}
私はそれを使用して、このようなテンプレート内の他の要素を切り替えています
<multiple-choice-radio *ngIf="expbTrigger"></multiple-choice-radio>
<multiple-choice-radio *ngIf="rebbTrigger"></multiple-choice-radio>
<multiple-choice-radio *ngIf="newbTrigger"></multiple-choice-radio>
親コンポーネントに基づいて必要な質問を送信するためにこれを行っています.1つの部分だけに限定されているわけではありませんが、すべてで使用されているわけではないため、手動で設定して使用するだけだと考えまし*ngIf
た.必要に応じてオンとオフを切り替えます。
が受け取ったquestions
オブジェクトに@Input
は 3 つの質問があります。expbTrigger = true
質問 1 と 2 を使用したい場合。質問rebbTrigger = true
3 を使用したい場合。このコードが機能すると考えました。
questionA: FirebaseObjectObservable<any>;
questionB: FirebaseObjectObservable<any>;
ngOnChanges(){
if(this.expbTrigger = true){
this.questionA = this.questions.question01;
this.questionB = this.questions.question02;
} else if(this.rebbTrigger = true){
this.questionA = this.questions.question03;
this.questionB = null;
}
}
しかし、私はこのエラーが発生します
Property 'question01' does not exist on type 'FirebaseObjectObservable<any>'
質問2と3についても同じことが言えます。コードをコメントアウトして実行console.log(questions)
すると、ログに記録され、その中のすべての質問が表示されます。同様に移動しようとしましたngAfterViewInit
が、同じエラーが発生しました。私が目にするすべての例は、ほぼ 1 層のデータであるため、ネストされたデータ本体の取得に関して何が間違っているのかを判断するのは困難です。誰でも助けることができますか?