The NgDiagramModelService provides methods for accessing and manipulating the diagram’s model.

Example usage

private modelService = inject(NgDiagramModelService);

// Add nodes
this.modelService.addNodes([node1, node2]);

Extends

• NgDiagramBaseService

Implements

• OnDestroy

Properties

edges

readonly edges: Signal<Edge<object>[]>

Readonly signal of current edges in the diagram.

---

metadata

readonly metadata: Signal<Metadata<object>>

Readonly signal of current diagram metadata.

---

nodes

readonly nodes: Signal<Node[]>

Readonly signal of current nodes in the diagram.

Methods

addEdges()

addEdges(edges, options?): Promise<void>

Adds new edges to the diagram.

Parameters

edges

Edge<object>[]

Array of edges to add.

options?

Optional settings. Set waitForMeasurements: true to resolve only after the added elements (e.g. edge labels) have been measured. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

addNodes()

addNodes(nodes, options?): Promise<void>

Adds new nodes to the diagram.

Parameters

nodes

Node[]

Array of nodes to add.

options?

Optional settings. Set waitForMeasurements: true to resolve only after the added nodes have been measured — useful before calling zoomToFit() or centerOnNode(). Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

attachEdge()

attachEdge(edgeId, end, nodeId, portId?): Promise<boolean>

Attaches one endpoint of an edge to a node and, optionally, to a port. This is the opposite of detachEdge.

The same checks as for a relink drop apply: the node must exist and be visible, and the port must exist, be visible and have the right direction. The connection is then validated with linking.validateConnection, which receives the attached node as source or target according to end, and a context with reason: 'attach'.

Parameters

edgeId

string

ID of the edge to attach.

end

EdgeEnd

Which endpoint to attach.

nodeId

string

ID of the node to attach to.

portId?

string

ID of the port to attach to. When omitted, the endpoint is attached to the node without a port.

Returns

Promise<boolean>

Whether the connection was valid and applied.

Since

1.4.0

---

computePartsBounds()

computePartsBounds(nodes, edges): Rect

Parameters

nodes

Node[]

Array of nodes

edges

Edge<object>[]

Array of edges

Returns

Rect

Bounding rectangle containing all visible nodes and edges. When there is nothing to measure (both arrays are empty, no visible node has measuredBounds, and no visible edge has points), returns a zero-size rectangle at the origin ({ x: 0, y: 0, width: 0, height: 0 }).

Since

0.9.0

Computes the axis-aligned bounding rectangle that contains all specified nodes and edges.

Node bounds come from measuredBounds, which includes the measured ports and the rotation, not from the raw position and size in the model. Nodes must therefore already be measured (rendered), and the result can be larger than the node rectangles because of the ports. Edges contribute their routed points and their measured labels.

Remarks

Since 1.4.0, effectively hidden elements (computedHidden) are left out, so their old geometry does not enlarge the result. If all given elements are hidden, the result is the same zero-size rectangle at the origin as for unmeasured elements.

---

deleteEdges()

deleteEdges(ids): Promise<void>

Deletes edges by their IDs.

Parameters

ids

string[]

Array of edge IDs to delete.

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

deleteNodes()

deleteNodes(ids): Promise<void>

Deletes nodes by their IDs.

Deleting a group also deletes all of its descendants (children, grandchildren, and so on). Edges connected to any deleted node are removed as well. This is the same behavior as deleting the selection.

Parameters

ids

string[]

Array of node IDs to delete.

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

detachEdge()

detachEdge(edgeId, end, position?): Promise<void>

Detaches one endpoint of an edge, so that it becomes a free (dangling) endpoint.

When position is omitted, the endpoint stays anchored where it is now: at the current position of the port when the edge was connected to a port, otherwise at the routed endpoint of the edge.

Requires danglingEdges.enabled. With the feature off, this method does nothing and logs a console warning.

Parameters

edgeId

string

ID of the edge to detach.

end

EdgeEnd

Which endpoint to detach.

position?

Point

Optional anchor position for the freed endpoint, in flow coordinates.

Returns

Promise<void>

Since

1.4.0

---

getChildren()

getChildren<T>(groupId): Node<T>[]

Gets all children nodes for a given group node id

Type Parameters

T

T extends object = object

The type of the nodes’ data property. Defaults to DataObject.

Parameters

groupId

string

group node id

Returns

Node<T>[]

Array of child nodes

---

getChildrenNested()

getChildrenNested<T>(groupId): Node<T>[]

Gets all nested children (descendants) of a group node

Type Parameters

T

T extends object = object

The type of the nodes’ data property. Defaults to DataObject.

Parameters

groupId

string

Group node id

Returns

Node<T>[]

Array of all descendant nodes (children, grandchildren, etc.)

---

getConnectedEdges()

getConnectedEdges<T>(nodeId): Edge<T>[]

Gets all edges connected to a node

Type Parameters

T

T extends object = object

The type of the edges’ data property. Defaults to DataObject.

Parameters

nodeId

string

Node id

Returns

Edge<T>[]

Array of edges where the node is either source or target

---

getConnectedNodes()

getConnectedNodes<T>(nodeId): Node<T>[]

Gets all nodes connected to a node via edges

Type Parameters

T

T extends object = object

The type of the nodes’ data property. Defaults to DataObject.

Parameters

nodeId

string

Node id

Returns

Node<T>[]

Array of nodes connected to the given node

---

getDanglingEndpoints()

getDanglingEndpoints(): DanglingEndpoint[]

Returns the free (unconnected) endpoints of all edges in the model. A dual dangling edge gives two entries. Temporary and effectively hidden edges are skipped.

Returns

DanglingEndpoint[]

The free endpoints with their edge, end and anchor position.

Since

1.4.0

---

getEdgeById()

getEdgeById<T>(edgeId): null | Edge<T>

Gets an edge by id.

Type Parameters

T

T extends object = object

The type of the edge’s data property. Defaults to DataObject.

Parameters

edgeId

string

Edge id.

Returns

null | Edge<T>

Edge or null if not found.

---

getModel()

getModel(): ModelAdapter

Returns the current model that NgDiagram instance is using. Returns null if flowCore is not initialized.

Returns

ModelAdapter

---

getNearestDanglingEndpointInRange()

getNearestDanglingEndpointInRange(point, range): null | DanglingEndpoint

Finds the free edge endpoint nearest to a point within a range. It works like getNearestPortInRange, but for the free endpoints of dangling edges. Temporary and effectively hidden edges are skipped.

Parameters

point

Point

Point to check from.

range

number

Range to check in.

Returns

null | DanglingEndpoint

Nearest free endpoint in range, or null.

Since

1.4.0

---

getNearestNodeInRange()

getNearestNodeInRange<T>(point, range): null | Node<T>

Gets the nearest node in a range from a point.

Type Parameters

T

T extends object = object

The type of the node’s data property. Defaults to DataObject.

Parameters

point

Point

Point to check from.

range

number

Range to check in.

Returns

null | Node<T>

Nearest node in range or null.

---

getNearestPortInRange()

getNearestPortInRange(point, range): null | Port

Gets the nearest port in a range from a point.

Parameters

point

Point

Point to check from.

range

number

Range to check in.

Returns

null | Port

Nearest port in range or null.

---

getNodeById()

getNodeById<T>(nodeId): null | Node<T>

Gets a node by id.

Type Parameters

T

T extends object = object

The type of the node’s data property. Defaults to DataObject.

Parameters

nodeId

string

Node id.

Returns

null | Node<T>

Node or null if not found.

---

getNodeEnds()

getNodeEnds<S, T>(edgeId): null | { source: Node<S>; target: Node<T>; }

Gets the source and target nodes of an edge

Type Parameters

S

S extends object = object

The type of the source node’s data property. Defaults to DataObject.

T

T extends object = object

The type of the target node’s data property. Defaults to DataObject.

Parameters

edgeId

string

Edge id

Returns

null | { source: Node<S>; target: Node<T>; }

Object containing source and target nodes, or null if edge doesn’t exist

---

getNodesInRange()

getNodesInRange<T>(point, range): Node<T>[]

Gets all nodes in a range from a point.

Type Parameters

T

T extends object = object

The type of the nodes’ data property. Defaults to DataObject.

Parameters

point

Point

Point to check from.

range

number

Range to check in.

Returns

Node<T>[]

Array of nodes in range.

---

getOverlappingNodes()

Call Signature

getOverlappingNodes<T>(nodeId): Node<T>[]

Detects collision with other nodes by finding all nodes whose rectangles intersect with the specified node’s bounding rectangle.

Type Parameters

T

T extends object = object

The type of the nodes’ data property. Defaults to DataObject.

Parameters

nodeId

string

The ID of the node to check for collisions

Returns

Node<T>[]

An array of Nodes that overlap with the specified node

Call Signature

getOverlappingNodes<T>(node): Node<T>[]

Type Parameters

T

T extends object = object

The type of the nodes’ data property. Defaults to DataObject.

Parameters

node

Node<T>

The node to check for collisions

Returns

Node<T>[]

An array of Nodes that overlap with the specified node

Since

0.9.0

Detects collision with other nodes by finding all nodes whose rectangles intersect with the specified node’s bounding rectangle.

---

getParentHierarchy()

getParentHierarchy<T>(nodeId): GroupNode<T>[]

Gets the full chain of parent group Nodes for a given nodeId.

Type Parameters

T

T extends object = object

The type of the group nodes’ data property. Defaults to DataObject.

Parameters

nodeId

string

Node id

Returns

GroupNode<T>[]

Array of parent group Node objects, from closest parent to farthest ancestor

---

isNestedChild()

isNestedChild(nodeId, groupId): boolean

Checks if a node is a nested child (descendant) of a group node

Parameters

nodeId

string

Node id

groupId

string

Group node id

Returns

boolean

True if the node is part of the group’s nested subgraph

---

toJSON()

toJSON(): string

Serializes the current model to a JSON string.

Returns

string

The model as a JSON string.

---

updateEdge()

updateEdge(edgeId, edge, options?): Promise<void>

Updates the properties of an edge.

Parameters

edgeId

string

Edge id.

edge

Partial<Edge>

New edge properties.

options?

Optional settings. Set waitForMeasurements: true to resolve only after measurements triggered by the update have completed. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

updateEdgeData()

updateEdgeData<T>(edgeId, data, options?): Promise<void>

Updates the data of an edge.

Type Parameters

T

T extends object = object

The type of the edge’s data property. Defaults to DataObject.

Parameters

edgeId

string

Edge id.

data

T

New data to set for the edge.

options?

Optional settings. Set waitForMeasurements: true to resolve only after measurements triggered by the update (e.g. re-rendered edge labels) have completed. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

updateEdges()

updateEdges(edges, options?): Promise<void>

Updates multiple edges at once.

Parameters

edges

Pick<Edge<object>, "id"> & Partial<Edge<object>>[]

Array of edge updates (must include id and any properties to update).

options?

Optional settings. Set waitForMeasurements: true to resolve only after measurements triggered by the update have completed. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

updateNode()

updateNode(nodeId, node, options?): Promise<void>

Updates the properties of a node.

Parameters

nodeId

string

Node id.

node

Partial<Node>

New node properties.

options?

Optional settings. Set waitForMeasurements: true to resolve only after measurements triggered by the update have completed. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

updateNodeData()

updateNodeData<T>(nodeId, data, options?): Promise<void>

Updates the data of a node.

Type Parameters

T

T extends object = object

The type of the node’s data property. Defaults to DataObject.

Parameters

nodeId

string

Node id.

data

T

New data to set for the node.

options?

Optional settings. Set waitForMeasurements: true to resolve only after measurements triggered by the update (e.g. a template resized by the new data) have completed. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.

---

updateNodes()

updateNodes(nodes, options?): Promise<void>

Updates multiple nodes at once.

Parameters

nodes

Pick<Node, "id"> & Partial<Node>[]

Array of node updates (must include id and any properties to update).

options?

Optional settings. Set waitForMeasurements: true to resolve only after measurements triggered by the update have completed. Available since 1.3.0.

waitForMeasurements?

boolean

Returns

Promise<void>

A promise that resolves once the change has been applied to the model. Inside a transaction, the promise resolves right away and the change is applied when the transaction commits.