diagram.removePorts() expects Type 'Node' instead of 'NodeModel'

Question

Hello,I'm actually facing a problem with the 
diagram.removePorts()-function. I followed the example "Remove ports at 
runtime" (https://ej2.syncfusion.com/documentation/diagram/ports/#remove-ports-at-runtime ) and did:let portToRemove = this.node.ports.find(x => x.id == portId);dia.removePorts(dia.nodes[0], portToRemove); While compiling my typescript-code to Javascript the compiler throws following error:Error:line (173)TS2345: Argument of type 'NodeModel' is not assignable to parameter of type 'Node'. Type 'NodeModel' is missing the following properties from type 'Node': 
oldGradientValue, isCanvasUpdate, status, parentId, and 41 more.The removePorts() function expects as parameters an Node and a PointPortModel[], but the diagram only contains 'NodeModel' and not 'Node'-type in diagram.nodes. I'm not sure if this is wanted, but I don't know how to handle this, because dia.removePorts(dia.nodes[0] as Node, portToRemove);doesn't work either. However, while Diagram.removePorts() expects 'Node' and 'PointPortModel' the other Diagram functions like 'addPorts' work with 'NodeModel'-types. What is the reason for this behaviour and how can I reach my goal and remove ports while runtime? 
And is the documentation outdated at this specific point?

Kind regards,Constantin

Gowtham Gunashekar · Accepted Answer

Hi Constantin,  
 
On the further analysis of the shared details, we suggest you to import the Node from the package “@syncfusion/ej2-diagrams” and use “as” to conver the nodeModel into Node.we susupect that the reason for the reported issue is you might have imported the Node form some other package, so please ensure that you have imported from “@syncfusion/ej2-diagrams” package. We have added the sample for you references and in the sample we have fixed the reported waring issue. 
 
Code snippet: 
 




import { 
  Diagram, 
  Node 
} from '@syncfusion/ej2-diagrams'; 
 
function Function() { 
  diagram.removePorts(diagram.nodes[0] as Node, ports); 
} 
 
Sample link: https://stackblitz.com/edit/ijhiva-occhbg?file=index.ts 
 
If still the issue persists, please replicate the reported issue in the shared sample that will help us to go ahead further.  
 
Regards, 
Gowtham

Arunkumar Manoharan · Answer

Hi Constantin, 
 
Greeting’s from Syncfusion, 
 
 We have created a sample on removing ports at runtime. In this sample, we have created a button and on clicking the button the ports are removed at the run time. For more information, please refer to the code snippet and sample link. 
Code snippet: 




let ports: PointPortModel[] = [{ 
    id: 'port1', 
},  
{ 
    id: 'port2', 
}, 
 { 
    id: 'port3', 
}, 
 { 
    id: 'port4', 
} 
] 
 
document.getElementById('remove').onclick = Function; 
function Function() { 
  diagram.removePorts(diagram.nodes[0], ports); 
} 
 
Sample link: https://stackblitz.com/edit/ijhiva-zbtkqu?file=index.ts  
 
Regards   
Arun.

Constantin · Answer

Hi Arun,thanks for your fast response and the preparation of an example.Actually, I'm really confused, because even in your example on stackblitz (line 104) is 'diagram.nodes[0]' red underlined with the message: '

Argument of type 'NodeModel' is not assignable to parameter of type 'Node'.  Type 'NodeModel' is missing the following properties from type 'Node': oldGradientValue, isCanvasUpdate, status, parentId, and 41 more.'Your example works, but I 'm not familiar with StackBlitz and don't know if the code gets compiled or not. However, due to the typing error in the removePorts-function, I am unable to compile my code to JavaScript. How can I compile my Code to JavaScript utilizing this function? And why does the removePorts-function expects a parameter with type of 'Node' instead of 'NodeModel' like the other diagram functions expect? Regards,Constantin

Constantin · Answer

Hi Gowtham,thank you very much for your response. You were totally right with your suggestion. I already tried to convert the nodeModel into Node utilizing "as"-keyword, but did not import 'Node' from ej2-diagrams.Kind Regards,Constantin

Gowtham Gunashekar · Answer

Hi Constantin, 
 
Thanks for your update. Please let us know whether you need any further assistance on this. 
 
 
Regards  
Gowtham