无法从 Firebase 更新和删除对象

Question

我正在 Angular 中使用 Firebase 开发一个项目。我无法从 Firebase 数据库更新和删除对象。

这是代表我的问题的Stackblitz Example。

component.ts

update(course) {
    this.db.object('/courses/' + course.key ).update(course.value + 'updated');
}

delete(course) {
    this.db.object('/courses/' + course.key ).remove();
}

component.html

<div class="form-group mt-4">
    <input type="text" class="form-control" placeholder="Enter cource..." (keyup.enter)="add(course)" #course>
</div>
<ul class="list-group">
    <li class="list-group-item d-flex justify-content-between align-items-center" *ngFor="let course of course$ | async | keyvalue">{{course.value}} <span><button (click)="update(course)" type="button" class="btn btn-sm btn-outline-success mr-2">Update</button><button (click)="delete(course)" type="button" class="btn btn-sm btn-outline-danger">Delete</button></span></li>
</ul>

Answer 1

你需要监听snapshotChanges来获取文档的实际key，更新时可以参考（我这里使用set，因为它不需要对象）和删除。所以改变你获取数据的方式。通常我使用扩展运算符添加有效负载数据，但由于您的有效负载只是一个字符串，我将其添加为变量 payload（您可以选择自己的名称）并将文档 ID 存储为 key：

this.course$ = this.courses.snapshotChanges().pipe(
  map((changes: any) => {
    const data = changes.map(d => ({ key: d.key, payload: d.payload.val()}))
    return data;
  })
)

然后就可以使用正确的密钥进行更新和删除了：

update(course) {
  this.db.object('/courses/' + course.key).set(course.payload + ' updated');
}

delete(course) {
  this.db.object('/courses/' + course.key).remove();
}

然后我们需要对模板进行一些更改，我们不需要 keyvalue 管道：

<li *ngFor="let course of course$ | async "> {{course.payload}} </li>

你的分叉STACKBLITZ

也不要使用any，输入你的数据，让你的生活更轻松！！

Answer 2

update() 方法采用具有键值对的 JavaScript 对象。

但在此调用中，您传递的是一个无效的字符串值：

this.db.object('/courses/' + course.key ).update(course.value + 'updated');

修复取决于您在数据库中 /courses/$key 下存储的内容。

如果您在 /courses/$key 下的结构是一个对象，并且看起来像这样：

"courses": {
  "coursekey": {
    "property1": "value",
    "property2": "value"
  }
}

您可以通过以下方式更新特定的属性：

this.db.object('/courses/coursekey').update({ property1: 'updated' });

如果您在 /courses/$key 下的结构是单个值，并且如下所示：

"courses": {
  "coursekey": "value"
}

您可以通过以下方式更新它：

this.db.object('/courses/coursekey').set('updated');

无法从 Firebase 更新和删除对象

Unable to Update and Delete an Object from Firebase

javascript

firebase

firebase-realtime-database

angularfire2

angular