DEV Community 👩‍💻👨‍💻

Nando AM
Nando AM

Posted on

ngx-smart-modal 'onDataAdded' called many times

I'm new using angular8 and the library ngx-smart-modal to make a list of clients each one with one button to remove him from the list. When I click on the button I show a confirm modal and when click on accept, passes the client code to another compoment wich search that code and remove the affected index from the array list.

Problem is: in the first modal opened, 'onDataAdded' is called once (expected behavior). In the second is called twice (not expected) and so on...

When I click on 'delete', it triggers this function from 'clients' component which opens the confirmation modal and waits for response (onDataAdded):

delClientModal( index: number ) {
  this.clientToRemove = this.clients[index];
  this.clientService._passClient(this.clients[index]);
  this.ngxSmartModalService.getModal('delClientModal').open();
  this.ngxSmartModalService.get('delClientModal').onDataAdded.subscribe((data: any) => {
    const indexToRemove = this.clients.findIndex(i => i.clientcode === data);
    if (indexToRemove >=  0) {
      this.clients.splice(this.clients.findIndex(i => i.clientcode === data), 1);
    }
  });
}

When I click on accept, it triggers this function from 'client' component wich send the client code to clientService (for api operations) and set the data to de modal for 'onDataAdded' to catch it:

delClient(clientcode: string) {
    this.clientService._deleteClient(this.client);
    this.ngxSmartModalService.setModalData(clientcode, 'delClientModal');
    this.ngxSmartModalService.resetModalData('delClientModal');
  }

What I'm not getting right?

Top comments (1)

Collapse
 
lakshmitj profile image
lakshmitj

I have same issue . did you find a solution for this?

DEV has this feature:

Settings

Go to your customization settings to nudge your home feed to show content more relevant to your developer experience level. 🛠