我正在尝试将 ionic5 Form 与 Firebase 结合使用。如下图所示,这个表单包含一些输入文本,如会员姓名、dob、电子邮件等。我生成了会员页面以及member服务和会员界面 和已经配置好的环境。当我运行应用程序时,我收到此错误 ERROR TypeError: this.memberListRef is undefined。
请在下面找到代码脚本。
member.service.ts
import { Injectable } from '@angular/core';
import { Member } from '../shared/member';
import { AngularFireDatabase, AngularFireList, AngularFireObject } from '@angular/fire/database';
@Injectable({
providedIn: 'root'
})
export class MemberService {
memberListRef: AngularFireList<any>;
memberRef: AngularFireObject<any>;
constructor(private db: AngularFireDatabase) { }
// Create
createMember(apt: Member) {
return this.memberListRef.push({
member_name: apt.member_name,
member_dob: apt.member_dob,
member_email: apt.member_email,
member_club_id: apt.member_club_id,
member_contact: apt.member_contact,
member_address: apt.member_address
})
}
.
.
.
.
}
这是我的add-member.page.ts
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { FormGroup, FormBuilder } from "@angular/forms";
import { MemberService } from './../shared/member.service';
@Component({
selector: 'app-add-member',
templateUrl: './add-member.page.html',
styleUrls: ['./add-member.page.scss'],
})
export class AddMemberPage implements OnInit {
memberForm: FormGroup;
constructor(
private aptService: MemberService,
private router: Router,
public fb: FormBuilder
) { }
ngOnInit() {
this.memberForm = this.fb.group({
member_name: [''],
member_dob: [''],
member_email: [''],
member_club_id: [''],
member_contact: [''],
member_address: ['']
})
}
formSubmit() {
if (!this.memberForm.valid) {
return false;
} else {
this.aptService.createMember(this.memberForm.value).then(res => {
console.log(res)
this.memberForm.reset();
this.router.navigate(['/club']);
})
.catch(error => console.log(error));
}
}
}
感谢您的帮助。
答案 0 :(得分:0)
修复这个错误是在push之前定义memberListRef
createMember(apt: Member) {
this.memberListRef=this.db.list('member')
return this.memberListRef.push({
member_name: apt.member_name,
member_dob: apt.member_dob,
member_email: apt.member_email,
member_club_id: apt.member_club_id,
member_contact: apt.member_contact,
member_address: apt.member_address
})
}