Html TypeError:无法读取属性'；设置'；角度为的isFirebaseRef处的空值

我第一次使用firebase和angular

我在YouTube上用Firebase一步一步地执行Angular 6 CRUD操作，当我在Google chrome控制台中按submit然后弹出错误窗口时，无法将值设置到Firebase实时数据库中

YouTube链接：

OrganizationComponent.html

<div class="row">
  <div class="col-md-5">
    <form [formGroup]="this.organizationService.form" (ngSubmit)="onSubmit()">
      <input type="hidden" formControlName="$key">
      <div class="form-group">
        <label>Full Name</label>
        <input formControlName="fullname" class="form-control" [ngClass]="{'is-invalid':submitted && formControls.fullname.errors}">
        <div class="invalid-feedback" *ngIf="submitted && formControls.fullname.errors">
          This field is required.</div>
      </div>
      <div class="form-group">
        <label>Email</label>
        <input formControlName="email" class="form-control" [ngClass]="{'is-invalid':submitted && formControls.email.errors}">
        <div class="invalid-feedback" *ngIf="submitted && formControls.email.errors">
          Invalid email address.</div>
      </div>
      <div class="form-group">
        <label>Mobile</label>
        <input formControlName="mobile" class="form-control" [ngClass]="{'is-invalid':submitted && formControls.mobile.errors}">
        <div class="invalid-feedback" *ngIf="submitted && formControls.mobile.errors">
          <label *ngIf="formControls.mobile.errors.required">This field is required.</label>
          <label *ngIf="formControls.mobile.errors.minlength">Atleast 8 numbers.</label>
        </div>
      </div>
      <div class="form-group">
        <label>Location</label>
        <input formControlName="location" class="form-control">
      </div>
      <div class="form-group">
        <input type="submit" class="btn btn-primary" value="Submit">
      </div>
    </form>
    <div class="alert alert-info"  *ngIf="showSuccessMessage">
      Submitted successfully.
    </div>
  </div>
  <div class="col-md-7">
    <app-organization-list></app-organization-list>
  </div>
</div>

OrganizationService.ts

import { Component, OnInit } from '@angular/core';
import { OrganzationService } from '../shared/organization.service';



@Component({
  selector: 'app-organization',
  templateUrl: './organization.component.html',
  styleUrls: ['./organization.component.css']
})
export class OrganizationComponent implements OnInit {

  constructor(private organizationService: OrganzationService) { }

  submitted: boolean;
  showSuccessMessage: boolean;
  formControls = this.organizationService.form.controls;

  ngOnInit() {
  }

  onSubmit(){

    this.submitted = true;

    if(this.organizationService.form.valid){
       if(this.organizationService.form.get('$key').valid == null)
      this.organizationService.insertOrganization(this.organizationService.form.value);
      else
      this.organizationService.updateOrganization(this.organizationService.form.value);
      this.showSuccessMessage = true;
      setTimeout(() => this.showSuccessMessage = false,3000);
      this.submitted = false;
      this.organizationService.form.reset();
      this.organizationService.form.setValue({
        $key: null,
        fullname: '',
        email: '',
        mobile: '',
        location: ''
      })
    }
  }

}

import { Injectable } from '@angular/core';

import {FormControl,FormGroup,Validators} from "@angular/forms";
import {AngularFireDatabase,AngularFireList} from 'angularfire2/database';



@Injectable({
  providedIn: 'root'
})
export class OrganzationService {

  constructor(private firebase: AngularFireDatabase) { }
  organizationList: AngularFireList<any>;

  form = new FormGroup({

    $key: new FormControl(null),
    fullname: new FormControl('',Validators.required),
    email: new FormControl('',Validators.email),
    mobile: new FormControl('',[Validators.required,Validators.minLength(8)]),
    location: new FormControl('')


  });

  getOrganizations() {
    this.organizationList = this.firebase.list('organizations');
    return this.organizationList.snapshotChanges();
  }


  insertOrganization(organization) {
    this.organizationList.push({

      fullname: organization.fullname,
      email: organization.email,
      mobile: organization.mobile,
      location: organization.location
    });
  }

  populateForm(organization) {
    this.form.setValue(organization);
  }

  updateOrganization(organization) {
    this.organizationList.update(organization.$key,
      {
        fullname: organization.fullname,
        email: organization.email,
        mobile: organization.mobile,
        location: organization.location
      });


  deleteOrganization($key: string) {
    this.organizationList.remove($key);
  }

}

从'@angular/core'导入{Injectable}；
从“@angular/forms”导入{FormControl，FormGroup，Validators}；
从“angularfire2/database”导入{AngularFireDatabase，AngularFireList}；
@注射的({
providedIn:'根'
})
导出类组织服务{
构造函数（私有firebase:AngularFireDatabase）{}
组织列表：AngularFireList；
表单=新表单组({
$key:newformcontrol（null），
全名：新FormControl（“”，需要验证程序），
电子邮件：新FormControl（“”，Validators.email），
mobile:newformcontrol（“”，[Validators.required，Validators.minLength（8）]），
位置：新表单控件（“”）
});
getOrganizations（）{
this.organizationList=this.firebase.list（“组织”）；
返回此.organizationList.snapshotChanges（）；
}
插入组织（组织）{
此文件为.organizationList.push({
全名：organization.fullname，
电子邮件：organization.email，
mobile:organization.mobile，
地点：组织。地点
});
}
大众形式（组织）{
此.form.setValue（组织）；
}
更新组织（组织）{
此.organizationList.update（organization.$key，
{
全名：organization.fullname，
电子邮件：organization.email，
mobile:organization.mobile，
地点：组织。地点
});
deleteOrganization（$key:string）{
this.organizationList.remove（$key）；
}
}

请提供。请提供。