我一直收到此错误。我正在将数据推送到Firebase。我正在使用离子4
Reference.push失败:第一个参数包含属性'Questions.code'中的未定义
我在下面发布了我的html,.ts和我的界面文件。
当我按下提交时,数据应该存储在firebase中。并且我相信我的界面文件中具有属性“ Question.code”。
这是我的html文件
<ion-content class="home">
<form
[formGroup]="form"
(ngSubmit)="manage(form.value)">
<ion-list>
<ion-input
type="text"
maxlength="100"
formControlName="name" ></ion-input>
<div class ="thebody"formArrayName="questions">
<section
[formGroupName]="i"
*ngFor="let quest of form.controls.questions.controls; let i = index">
<ion-item-group>
<ion-item-divider class="itemdivider">Question no.{{ i + 1 }}</ion-item-divider>
<ion-item>
<ion-label floating>Question</ion-label>
<ion-input
type="text"
maxlength="50"
formControlName="name" [(ngModel)]="questions[i]" ></ion-input>
</ion-item>
<!--All the buttons part-->
<span
float-right
ion-button
icon-left
clear
color= "dark"
*ngIf="form.controls.questions.length> 1"
(click)="removeInputField(i)">
<ion-icon md="md-remove-circle"></ion-icon>
</span>
<span
float-right
ion-button
icon-left
clear
(click)="showOptions()"
>
<ion-icon md="md-options"></ion-icon>
</span>
</ion-item-group>
</section>
</div>
<span
ion-button
float-left
icon-left
clear
(click)="addNewInputField()">
<ion-icon md="md-add-circle"color="dark"></ion-icon>
Add a new question
</span>
</ion-list>
<!-- Only allow form to be submitted IF validation criteria for
input fields has been successfully passed text-center
[disabled]="!form.valid"-->
<button
ion-button
block
margin-top
color="dark"
(click)="submitQuiz(questions)">Submit</button>
</form>
</ion-content>
这是我的.ts文件
import { Component, OnInit } from '@angular/core';
import {FormBuilder, FormArray, FormGroup, Validators } from '@angular/forms';
import { Quiz, Questions } from '../../services/event/quiz.interface';
import {AngularFireList} from 'angularfire2/database';
import { AngularFireDatabase} from 'angularfire2/database';
import { ActivatedRoute } from '@angular/router';
@Component({
selector: 'app-event-create',
templateUrl: './event-create.page.html',
styleUrls: ['./event-create.page.scss'],
})
export class EventCreatePage implements OnInit {
quiz= {} as Quiz;
questions= {} as Questions;
questions$: AngularFireList<Questions>;
i = 1;
j=0;
z=0;
public form : FormGroup;
constructor(private databse: AngularFireDatabase,private _FB: FormBuilder,private route: ActivatedRoute,) {
this.questions$ = this.databse.list('Questions');
this.form = this._FB.group({
name: ['',Validators.required],
questions :this._FB.array([
this.initQuestionsField()
])
});
}
initQuestionsField(): FormGroup{
return this._FB.group({
name : ['',Validators.required]
});
}
addNewInputField():void {
const control = <FormArray>this.form.controls.questions;
control.push(this.initQuestionsField());
this.i=this.i +1;
}
removeInputField(i :number):void{
const control =<FormArray>this.form.controls.questions;
control.removeAt(i);
}
submitQuiz(questions: Questions) {
this.route.params.subscribe((params) => {
const code = params.code;
console.log(code);
for (let z = 0; z < this.i; z++) {
console.log(questions[z]);
this.questions$.push({
code: code,
question: questions[z]
});
}
});
}
ngOnInit() {
}
}
这是我的界面文件
export interface Quiz {
code: String;
}
export interface Users {
email: String;
password: String;
nickname: String;
}
export interface Questions{
code: String;
question: any;
}