after deleting data from firebase it is still showing in table in angula 4

Question

I am working on angular 4 project I am using smart table in it. for database I am using firebase. I have write an function for deleting the row data it is deleting from the firebase but other data is showing two times (duplicate). following is the code

I have write function in service to get data as follow

getEData() 
 {

    return this.af.list('/enquirydata').snapshotChanges().map(changes => {
      return changes.map(c => ({ key: c.payload.key, ...c.payload.val() }));
    });
 }

also for delete I have write following function in service

deleteEnquiry(data){
    this.af.list(`/enquirydata`).remove(data);
    console.log("item deleted");

}

now in component.ts I have write as follows

source: LocalDataSource = new LocalDataSource();
  items: Array<any> = [];


  constructor(private service: SmartTableService, private router: Router) {
 this.service.getEData().subscribe(k=> {
  k.map(c=> {
  this.items.push(c);
      this.source.load(this.items);
  })
  });
    } 

onDelete(event) {
console.log(event);
    if (window.confirm('Are you sure you want to delete?')) {
      this.service.deleteEnquiry(event.data.key);
    } else {
      event.confirm.reject();
    }
  }

any help?

Answer 1

 this.service.getEData().subscribe(k=> {
   this.items = [...k]; // use can use array destructuring
   this.source.load(this.items);
 });
}