We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Binding to nodes and updating dynamically

Thread ID:

Created:

Updated:

Platform:

Replies:

126370 Oct 11,2016 09:02 AM Oct 14,2016 06:13 AM Angular 3
loading
Tags: ejDiagram
Aaron Bond
Asked On October 11, 2016 09:02 AM

Hi there!

I'm using the diagram control to create a BPM flowchart for a POC and I'm loving the integration.  

Unfortunately, I think I might be missing a step somewhere. I have a collection of Node models which I then bind into the diagram through the HTML template. However, when I update the collection of node models (such as with a push), the diagram does not update to reflect this.

I've put together this example to show what I am trying to achieve. Is this possible using the diagram control?

I've looked into methods like .updateData() and .refresh() but none seem to have the effect I'm expecting.

Thanks for your time,
Aaron

Shyam G [Syncfusion]
Replied On October 12, 2016 02:09 AM

Hi Aaron, 
 
You can use updateNode API method to update the nodes at runtime. Please refer to the code example and modified sample link below. 
 
Code example: 
 
        function updatenode() { 
            var diagram = $("#ejControl_0").ejDiagram("instance"); 
            var node = diagram.model.selectedItems.children[0]; 
            if (node) { 
                diagram.updateNode(node.name, { width: 200 }); 
            } 
        } 
 
 
 
Regards, 
Shyam G 


Aaron Bond
Replied On October 12, 2016 03:58 AM

Hi Shyam, thank you so much for your response!

Does this mean there is no way to ensure the two-way binding for the nodes? Updating them programmatically seems to go counter to the purpose of the Angular 2 integration, since the template bindings rely heavily on updating. I would have thought that updating the node collection in my component model would cause an update on the diagram also...

Aaron

Shyam G [Syncfusion]
Replied On October 14, 2016 06:13 AM

Hi Aaron, 
 
The angular 2 will not detect the changes which we done in our diagram’s client side events and the changes will be notified/detected only using all browser events (click, mouseover, keyup, etc.), setTimeout() and setInterval() and Ajax requests. Please refer to the link below.  
 
 
 
Regards, 
Shyam G 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;