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中删除

1 个答案: