Angular 6 + Firebase Reactive Forms

app.component.html

<form [formGroup]="form">
  <input class="input" type="text" formControlName="title" (change)="save()" /><br/>
  <input class="input" type="text" formControlName="content" (change)="save()" />
</form>

app.component.ts

import { Component, OnInit } from '@angular/core';
import { AngularFireDatabase, AngularFireObject } from 'angularfire2/database';
import { Observable } from 'rxjs';
import { FormGroup, FormBuilder, Validators, AbstractControl } from '@angular/forms';

export class Item {
  title = '';
  content = '';
}

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  item: AngularFireObject<Item>;
  form: FormGroup;

  constructor(
    private db: AngularFireDatabase,
    private fb: FormBuilder
  ) {}

  ngOnInit() {
    // this.item = this.create();
    this.item = this.load('-LD3ar4ZqhxSWObxmqsG');
    this.form = this.fb.group({
      title: ['', Validators.required],
      content: ['', Validators.required]
    });
    this.item.valueChanges().subscribe(item => {
      this.form.patchValue(item);
    });
  }

  create(): AngularFireObject<Item> {
    const key = this.db.list('/items').push(new Item()).key;
    return this.db.object(`/items/${key}`);
  }

  load(key): AngularFireObject<Item> {
    return this.db.object(`/items/${key}`);
  }

  save() {
    if (this.form.status !== 'VALID') {
      return false;
    }
    this.item.update(this.form.value);
  }

}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { AngularFireStorageModule } from 'angularfire2/storage';
import { AngularFireAuthModule } from 'angularfire2/auth';
import { ReactiveFormsModule } from '@angular/forms';
import { environment } from '../environments/environment';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    ReactiveFormsModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFireDatabaseModule,
    AngularFireAuthModule,
    AngularFireStorageModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }