Events

❗️

Deprecation Notice!

If you were using the old onXXX events (e.g. onActivate) - please use XXX (e.g. activate) instead, as these adhere to the Angular2 styleguide

Registering events
toggleExpanded
activeChanged
activate
deactivate
focus
blur
initialized
updateData
moveNode
event

Registering events

JavaScript

<tree-root [nodes]="nodes"
    (onToggle)="onEvent($event)"
    (onActiveChanged)="onEvent($event)"
    (onFocus)="onEvent($event)"
    (onBlur)="onEvent($event)">
  </tree-root>

  onEvent = ($event) => console.log($event);

treeModel

All events have a treeModel attribute that allows you to access the tree API.
Specific events and other attributes are listed below:

toggleExpanded

Triggers when expanding / collapsing a tree node.

📘

Parameters

eventName: string
node: ITreeNode
isActive: boolean

activeChanged

Triggers when activating / deactivating a tree node, by clicking on the node, or by using the Enter / Space keys.

📘

Parameters

eventName: string
node: ITreeNode
isActive: boolean

activate

Triggers when activating a tree node, by clicking on the node, or by using the Enter / Space keys.

📘

Parameters

eventName: string
node: ITreeNode

deactivate

Triggers when deactivating a tree node, by clicking on the node, or by using the Enter or Space keys.

📘

Parameters

eventName: string
node: ITreeNode

focus

Triggers when focusing on a node, by moving with the arrow keys.

📘

Parameters

eventName: string
node: ITreeNode

blur

Triggers when focusing on a node, by moving with the arrow keys.

📘

Parameters

eventName: string
node: ITreeNode

initialized

Triggers after tree model was created.
Good for performing actions immediately on init, like expanding / activating certain nodes, etc.
You can access the tree model using a ref, as described in the API section.

📘

Parameters

eventName: string

updateData

Triggers after tree model was updated, either by changing the inputs of the tree (nodes, options, etc.) or a direct call to update().

📘

Parameters

eventName: string

moveNode

This event is fired any time moveNode is called on the tree.
Typically - when drag and dropping a node.

📘

Parameters

eventName: string
node: ITreeNode. The node that was moved
to: Object containing:
parent: The parent node that contains the moved node
index: Index in the parent where the node was moved

event

Catch-all event that is triggered on every other event that is triggered.
Useful for doing the same action for different events by checking the eventName.
The parameters will match whatever event was sent originally.

📘

Parameters

eventName: string
...rest: corresponding to the original event