Question

我正在使用Firebase在Angular中进行一个项目。我无法从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来获取文档的实际密钥，该密钥在更新时可以使用（我在这里使用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更新和删除对象

2 个答案: