I am trying to refresh my page on delete and refresh button, it gets new data but the issue is new data will add to old ones I need to clear old data before adding new data.

Code

addresses: any[] = [];



// loads first time data

this.addressService.getAddresses().subscribe((res) => {

  for (let address of res['data']) {

    this.addresses.push(address);

  }

  this.hideLoading();

});



// refresh list items

doRefresh(event) {

console.log('Begin async operation');



setTimeout(() => {

    console.log('Async operation has ended');



// get new items in list

    this.addressService.getAddresses().subscribe((res) => {

    for (let address of res['data']) {

        this.addresses.push(address);

    }

    this.hideLoading();

    });



    event.target.complete();

}, 2000);

}



//remove item and renew list items

removeAddress(id: string){

this.addressService.remove(id).subscribe(

    data => {

    this.alertService.presentToast(data['message']);



//getting items (renew)

    this.addressService.getAddresses().subscribe((res) => {

        for (let address of res['data']) {

        this.addresses.push(address);

        }

        this.hideLoading();

    });



    },

    error => {

    this.alertService.presentToast(error['message']);

    }

);

}

I think that I need to clear addresses: any[] = []; before getting
new items in my doRefresh(event){..} and removeAddress(id:
string){...} functions to avoid duplicates.

Any idea?