Angular 文档未从firestore中删除

我正在使用angularfire 2。我想通过按下按钮从firestore中删除收藏。当我按下按钮时，控制台显示一个文档已被删除，但该文档仍然存在。在firestore中，我存储了一个集合（用户），我有许多文档，我想从集合中删除特定文档

app.component.ts

import { Component, OnInit } from '@angular/core';

import { AngularFirestore, AngularFirestoreCollection } from 
'angularfire2/firestore';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';

@Component({
templateUrl: 'app.component.html'
}) 
export class AppComponent implements OnInit  {
users: Observable<any[]>;


constructor(private afs: AngularFirestore) {


this.users = this.afs.collection('users').valueChanges();
}

ngOnInit() {
 this.usersCol = this.afs.collection('users');

 this.users = this.usersCol.snapshotChanges()
  .map(actions => {
    return actions.map(a => {
      const data = a.payload.doc.data() as User;
      const id = a.payload.doc.id;
      return { id, data };
    })
  })

}

 onDelete(userId)
  {
  this.afs.doc('users/'+userId).delete();


  }

  }

从'@angular/core'导入{Component，OnInit}；
从导入{AngularFirestore，AngularFirestoreCollection}
“angularfire2/firestore”；
从“rxjs/Observable”导入{Observable}；
导入'rxjs/add/operator/map'；
@组成部分({
templateUrl:'app.component.html'
}) 
导出类AppComponent实现OnInit{
用户：可观察；
建造商（私人afs:AngularFirestore）{
this.users=this.afs.collection（'users'）.valueChanges（）；
}
恩戈尼尼特（）{
this.usersCol=this.afs.collection（'users'）；
this.users=this.usersCol.snapshotChanges（）
.map（操作=>{
返回actions.map（a=>{
const data=a.payload.doc.data（）作为用户；
const id=a.payload.doc.id；
返回{id，data}；
})
})
}
onDelete（用户ID）
{
this.afs.doc（'users/'+userId）.delete（）；
}
}

app.component.html

<div class="card-body">
      <table class="table">
        <thead>
          <tr>


            <th>Photo</th>
           <th>Name</th>
           <th>Email</th>
           <th>Rating</th>

              <th >delete</th>

          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let user of users | async">

            <td >
              {{user.photoUrl}}
            </td>
    <td>
                     {{user.userName}}

                   </td>
                   <td >
                     {{user.email}}
                   </td>
                   <td>

                   {{user.rating}}
                 </td>

                   <td>

                   {{user.id}}
                 </td>


                   <td>
                       <button class="btn btn-sm btn-danger"  
      (click)="onDelete(user.id)">delete</button>
                   </td>


  </tr>
        </tbody>
      </table>
   </div>

照片
名称
电子邮件
评级
删除
{{user.photoUrl}
{{user.userName}
{{user.email}
{{user.rating}
{{user.id}
删除

---

任何帮助都将不胜感激。谢谢你

1-你正在用两个不同的值初始化你的用户。删除代码中的这一行：

this.users = this.afs.collection('users').valueChanges();

2-ngOnInit中返回的对象是类似于{1:id，2:user}的数组

您应该返回一个用户对象：

this.users = this.usersCol.snapshotChanges()
  .map(actions => {
    return actions.map(a => {
      let data = a.payload.doc.data() as User;
      data.id = a.payload.doc.id;
      return data;
    })
  })

通过键入代码，可以避免此类错误：

...
users: Observable<User[]>;
...
this.afs.collection<User>('users');
...

。。。
用户：可观察；
...
此.afs.集合（“用户”）；
...

您是否尝试过这种方式：

this.afs.collection（'users'）.doc（userId.delete（）？是的，但由于函数CollectionReference.doc（）要求其第一个参数的类型为string，因此出现了一个错误，但它是：在new FirestoreError（error.js:140）未定义。我知道，您的
用户.id
未定义，因为
.valueChanges（）
没有获取id值。您必须使用
.snapshotChanges（）
，正如本文中所解释的：我也使用了快照，它也会删除我的文档。但问题是，firestore文档中的内容不会显示在table app中。例如，在table中，它只会显示按钮，而不会显示姓名、电子邮件、照片和评级。