如何将Firebase实时数据库连接到Angular 7应用程序？使用CRUD操作

Question

我正在尝试将我的实时数据库连接到Angular 7应用程序。 我正在尝试对Angular 7应用进行编码，以便能够使用CRUD操作来更新数据库。

我已经在environment.ts文件中添加了我的实时数据库的API密钥。

我不确定要使用什么代码（HTML，CRUD，Service.ts）。 （显示作业列表，添加作业和删除作业的更多内容） 就像要显示，添加等的代码一样。

This is my Project files

这是我的crud.service.ts：

import { Injectable } from '@angular/core';
import { AngularFireDatabase, AngularFireList, AngularFireObject } from '@angular/fire/database';
import { User } from '../shared/user';

@Injectable({
  providedIn: 'root'
})

export class CrudService {
  usersRef: AngularFireList<any>;      // Reference to users list, Its an Observable
  userRef: AngularFireObject<any>;     // Reference to user object, Its an Observable too


  constructor(private db: AngularFireDatabase) { }   // Inject AngularFireDatabase dependency in constructor


  // Create User
  AddUser(user: User) {
    this.usersRef.push({
      name: user.Name,
      Date: user.Date,
      CompletitionStatus: user.CompletionStatus
    })
  }

  // Read User
  GetUser(id: string) {
    this.userRef = this.db.object('users-list/' + id);
    return this.userRef;
  }

  // Read Users List
  GetUsersList() {
    this.usersRef = this.db.list('Homework');
    console.log(this.usersRef);
  }  

  // Update User
  UpdateUser(user: User) {
    this.userRef.update({
      name: user.Name,
      Date: user.Date,
      CompletitionStatus: user.CompletionStatus
    })
  }  

  // Delete User
  DeleteUser(id: string) { 
    this.userRef = this.db.object('users-list/'+id);
    this.userRef.remove();
  }

}

这是我的用户。ts：

export interface User {
    $key: string;
    Name: string;
    Date: string;
    CompletionStatus: string;
 }