从firebase中删除数据后，它仍然显示在angula 4的表格中

问题描述：从firebase中删除数据后，它仍然显示在Angular 4的表格中。

回答：在Angular 4中，当从Firebase数据库中删除数据后，表格可能仍然显示已删除的数据。这是因为Angular 4使用了单向数据绑定的机制，即数据的变化不会自动反映到视图中。因此，需要手动更新表格以反映删除的数据。

解决这个问题的方法是在删除数据后，手动更新表格的数据源。以下是一种可能的解决方案：

在组件中定义一个数据源数组，用于存储从Firebase获取的数据。
在组件的初始化过程中，从Firebase获取数据并将其存储在数据源数组中。
在删除数据后，通过过滤数据源数组来移除已删除的数据。
在表格中使用数据源数组作为数据源，以显示数据。

下面是一个示例代码：

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

@Component({
  selector: 'app-data-table',
  templateUrl: './data-table.component.html',
  styleUrls: ['./data-table.component.css']
})
export class DataTableComponent implements OnInit {
  dataSource: any[];

  constructor(private db: AngularFireDatabase) { }

  ngOnInit() {
    // 从Firebase获取数据并存储在数据源数组中
    this.db.list('/data').valueChanges().subscribe(data => {
      this.dataSource = data;
    });
  }

  deleteData(data: any) {
    // 从Firebase删除数据
    this.db.object(`/data/${data.id}`).remove()
      .then(() => {
        // 从数据源数组中移除已删除的数据
        this.dataSource = this.dataSource.filter(item => item.id !== data.id);
      })
      .catch(error => {
        console.log('删除数据失败：', error);
      });
  }
}

在上面的代码中，dataSource是数据源数组，存储从Firebase获取的数据。在ngOnInit方法中，通过AngularFireDatabase从Firebase获取数据并将其存储在dataSource中。在deleteData方法中，通过AngularFireDatabase删除数据，并在成功删除后从dataSource中移除已删除的数据。

在表格模板中，使用dataSource作为数据源来显示数据。例如：

<table>
  <tr *ngFor="let data of dataSource">
    <td>{{ data.name }}</td>
    <td>{{ data.age }}</td>
    <!-- 其他列 -->
    <td><button (click)="deleteData(data)">删除</button></td>
  </tr>
</table>

这样，当从Firebase删除数据后，表格会自动更新以反映删除的数据。

推荐的腾讯云相关产品：腾讯云数据库（https://cloud.tencent.com/product/cdb）