AngularFire2

Question

我想知道为什么当我运行这个函数时，该项目从我的 Firebase 数据库中删除，但在我的 Angular 2 应用程序中，当它到达最后一个条目时，它将它删除从数据库中，但它不会从我的 *ngFor 循环中的列表中删除它。但是，如果我刷新页面，列表会更新并且条目不再存在。有人知道为什么会这样吗？

这是我的提供商中删除附件的功能：

removeAttachment(attachment, projectId, requestId) {
    return this._af.database.list(`/check_requests/${projectId}/${requestId}/attachments/${attachment.id}`).remove();
  }

这是我组件中的关联数组：

public attachments: any = [];
public attachmentKeys:any = [];

这是一个异步函数，它在数据库更新时随时填充 attachments 和 attachmentKeys 数组：

populateFormWithRequest() {
    this.formPopulationObs = this._checkRequests.getRequest(requestId, projectId).subscribe(requestData => {

      // Get the attachments
      if(requestData['attachments']) {
        this.attachments = requestData['attachments'];
        this.attachmentKeys = Object.keys(requestData['attachments']);
      }
   });
}

这是我的 html 模板中的 *ngFor 循环：

<ul class="attachment-list" *ngIf="attachments && (attachments | mapToIterable).length > 0">
          <li *ngFor="let key of attachmentKeys">
            <a target="_blank" href="{{attachments[key].url}}"><i class="fa fa-paperclip"></i>{{attachments[key].name}}</a>
            <button (click)="removeAttachment(attachments[key], key)"><i class="fa fa-times"></i></button>
          </li>
        </ul>

Answer 1

最有可能是这一行：

if (requestData['attachments']) {

当您删除最后一个附件时，attachments 属性将不存在于发出的请求对象中。如果 Firebase 数据库中的子项没有子项，它也会被删除。

所以 requestData['attachments'] 将是假的， attachments 和 attachmentKeys 属性将保持不变。

解决方案是这样的：

if (requestData['attachments']) {
  this.attachments = requestData['attachments'];
  this.attachmentKeys = Object.keys(requestData['attachments']);
} else {
  this.attachments = {};
  this.attachmentKeys = [];
}

AngularFire2 - 通过 Observable 删除一个项目 - 最后一个项目不会从 UI 中删除

AngularFire2 - Remove an item via Observable - last item doesn't remove from UI

firebase

angular