Removing nodes from Diagram dynamically in a loop

[Vithu R]

Hi,

My question is about removing nodes from a diagram dynamically on a loop.

I have a case where in I add nodes programatically with prefix "bbProvider" on the Id (ex. bbProvider_1, bbProvider_2, etc) using the command, "diagram.add". Now I have some sort of a "Cancel" button which should remove all those nodes with prefix "bbProvider". The way i do that is using regex to isolate the  prefixes. Here is the code snippet;

    const regex = new RegExp('bbProvider');

    for (let i = 0; i < this.diagram.nodes.length; i++) {

      let nd = this.diagram.nodes[i];

      if (regex.test(nd.id)) {

        console.log('should delete this = ', nd.id);

        this.diagram.remove(nd);

      }

    }

My issue is that it does not remove all the nodes I created. When I create 2 nodes, it removes only one, then the loop somewhat stops (i can see the console log). If i create 4 nodes it removes only 2. Is this the proper way of removing the code dynamically on a loop? or am i missing something?

Thank you for you help.

[Shyam G]

Hi Vithunan, 

We have created a sample in which we have removed all the diagram nodes with the for loop. Please refer to a code example and the sample below. 

Code example: 

removeNodes() {  

    if (this.diagram.nodes.length > 0) { 

      //iterate the nodes 

      for (let i = this.diagram.nodes.length - 1; i >= 0; i--) { 

        let node = this.diagram.nodes[i]; 

        //remove a node 

        this.diagram.remove(node); 

      } 

      alert(this.diagram.nodes.length); 

    } 

  } 

Sample: https://stackblitz.com/edit/angular-quhhcf-mmiy66?file=app.component.ts 

Regards, 

Shyam G