从Firebase中特定于用户的集合中删除文档

Question

我在从FireStore的用户列表中删除事件时遇到了麻烦。当用户选择一个事件添加到HTML中的*ngfor模板中的“event.ID”的“my Events”时，我可以看到Firestore添加的特定事件ID。

不过，无论我做什么，我都无法让删除功能正常工作。它实际上是说它运行成功，但没有删除任何东西。我想我在.doc（）和.delete（）方法之间遗漏了一些东西，但是Google文档非常模糊（或者我没有正确理解它们）。

我尝试指定一个路径，例如

.doc(`/users/${user.uid}/myEventList/${id}`

 removeEvent() {
    this.myEventListRef
      .doc()
      .delete()
      .then(function() {
        console.log("Document successfully deleted!");
      })
      .catch(function(error) {
        console.error("Error removing document: ", error);
      });
  } 

import { Injectable } from "@angular/core";
import * as firebase from "firebase/app";
import "firebase/auth";
import "firebase/firestore";
import { Observable } from "rxjs";
import { HttpClient } from "@angular/common/http";
import { ToastController } from "@ionic/angular";

@Injectable({
  providedIn: "root"
})
export class EventService {
  public myEventListRef: firebase.firestore.CollectionReference;
  public myEventsList: Observable<Event[]>;
  public currentEvent: any = {};

  constructor(
    public toastController: ToastController,
    private http: HttpClient
  ) {
    firebase.auth().onAuthStateChanged(user => {
      if (user) {
        this.myEventListRef = firebase
          .firestore()
          .collection(`/users/${user.uid}/myEventList`);
      }
    });
  }

  getEventList(): firebase.firestore.CollectionReference {
    return this.myEventListRef;
  }

  copyEvent(
    eventName: string,
    eventPrice: number,
    eventLocation: string,
    eventType: string
  ): Promise<firebase.firestore.DocumentReference> {
    return this.myEventListRef.add({
      name: eventName,
      price: eventPrice,
      location: eventLocation,
      type: eventType
    });
  }
  removeEvent() {
    this.myEventListRef
      .doc()
      .delete()
      .then(function() {
        console.log("Document successfully deleted!");
      })
      .catch(function(error) {
        console.error("Error removing document: ", error);
      });
  }

  getEventsObservable(): Observable<any> {
    return this.http.get("http://localhost:8080/events/eventslistX");
  }

  async addToMyEventsToast() {
    const toast = await this.toastController.create({
      color: "secondary",
      message: "Added to 'My Events'.",
      duration: 2000
    });
    toast.present();
  }
}

import { Component, OnInit } from "@angular/core";
import { EventService } from "../services/event.service";

import { Observable } from "rxjs";

@Component({
  selector: "app-my-events",
  templateUrl: "./my-events.page.html",
  styleUrls: ["./my-events.page.scss"]
})
export class MyEventsPage implements OnInit {
  public myEventsList: Array<any>;
  public currentEvent: any = {};

  constructor(private eventService: EventService) {}

  ngOnInit() {
    this.eventService
      .getEventList()
      .get()
      .then(eventListSnapshot => {
        this.myEventsList = [];
        eventListSnapshot.forEach(snap => {
          this.myEventsList.push({
            id: snap.id,
            name: snap.data().name,
            price: snap.data().price,
            location: snap.data().location,
            type: snap.data().type,
            date: snap.data().date
          });
          return false;
        });
      });
  }

  removeEventHandler() {
    this.eventService.removeEvent();
  }
}

我的HTML显示用户选择的事件列表，我可以在其中看到firestore id：

<ion-content>
  <ion-card *ngFor="let event of myEventsList; index as i">
    <ion-card-header>
      <ion-card-title>{{ event.id }}</ion-card-title>
      <ion-card-title>{{ event.name }}</ion-card-title>
      <ion-card-subtitle>$ {{ event.price }}</ion-card-subtitle>
      <ion-card-subtitle>City: {{ event.location }}</ion-card-subtitle>
      <ion-card-subtitle> Type of event : {{ event.type }}</ion-card-subtitle>
      <ion-icon
        name="close-circle"
        color="danger"
        (click)="removeEventHandler()"
      ></ion-icon>
    </ion-card-header>
  </ion-card>
</ion-content>

Answer 1

结果，我完全忘记了我所遵循的教程中提到的如何获取ID，因为我在阅读时不需要删除方法，所以我跳过了它。

在我的event-service.ts中，我添加了以下内容以从文档引用中获取id：

  getEventDetail(eventId: string): firebase.firestore.DocumentReference {
    return this.eventListRef.doc(eventId);
  }

并在同一服务中添加了以下方法：

  removeEvent(eventId) {
    this.eventListRef
      .doc(eventId)
      .delete()
      .then(function() {
        console.log("Document successfully deleted!");
      })
      .catch(function(error) {
        console.error("Error removing document: ", error);
      });
  }

  removeEventHandler(event) {
    this.eventService.removeEvent(event.id);
  }

(click)="removeEventHandler(event)"