TypeError：无法在Angular的isFirebaseRef上读取null的属性“ set”

Question

我从Firebase和angular开始我的第一次。

我从YouTube的Angular 6 CRUD使用Firebase操作开始，当我按Submit，然后在Google chrome控制台中弹出错误时，无法将值设置到firebase实时数据库中。

YouTube链接：https://www.youtube.com/watch?v=9wxEwE8UFr0

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>

Organization.component.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: ''
      })
    }
  }

}

OrganizationService.ts

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);
  }

}