admin管理员组

文章数量:1201373

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.targetplete();
}, 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?

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?

• javascript
• angular
• ionic-framework

Share Improve this question Follow asked Sep 11, 2019 at 3:04 mafortismafortis 7,1282626 gold badges149149 silver badges319319 bronze badges 3

• 1 Why not just do this.addresses = res['data']? – Cuong Le Ngoc Commented Sep 11, 2019 at 3:12
• ^ this works too, u might want to try this. But then again this is not really recommended if you have a huge dataset – Gene Commented Sep 11, 2019 at 3:17
• thanks for ideas i got it to work with answer below – mafortis Commented Sep 11, 2019 at 3:27

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 21

Assuming your refresh function works,

add this code before you get new items from your api

this.addresses =[];

or

this.addresses.length = 0;

For implementation wise, in regards to delete function, you can delete from your backend , clear your array and pull a fresh set of data which might be costly if you have a huge dataset.

You might want to consider updating your backend (delete that specific data) and removing that specific index from your array (when your delete function returns success)

For update, you can do a comparison and update those those array objects that has been modified. Else you can just clear your array and retrigger your retrieve api function.

本文标签： javascriptAngular clear arrayStack Overflow