Web SDK documentation
  1. Classes
  2. NavigatorNodeRoot

File

core/navigator/navigator-node-root.ts

Description

Root navigator node. Top node in the hierarchy. The root node is used as an anchor point for the rest of the nodes.

Extends

NavigatorNode

Index

Properties
Methods

Properties

children
children: NavigatorNode[]
Type : NavigatorNode[]
Default value : []

Navigator node children (subentries).
confirm
confirm: PopoverConfirmComponent
Type : PopoverConfirmComponent
Default value : undefined

Confirmation popover displayed at the end of the process of moving the navigator menu item.
draggable
draggable: boolean
Type : boolean
Default value : false

Indicates that the navigator node is draggable.
dragged
dragged:
Default value : false

Indicates that the navigator node is dragged.
draggedHover
draggedHover:
Default value : false

Indicates that currently something is dragged over the node.
droppable
droppable: boolean
Type : boolean
Default value : false

Indicates that the navigator node is droppable.
hidden
hidden: boolean
Type : boolean
Default value : false

Indicates that the navigator node is visible/hidden.
icon
icon: string
Type : string

Navigator node icon.
Optional iconComponent
iconComponent: Type<any>
Type : Type<any>

Custom icon component.
Optional iconTemplate
iconTemplate: TemplateRef<any>
Type : TemplateRef<any>

Custom icon template.
label
label:

Label to be displayed in the navigator node.
Optional loading
loading: boolean
Type : boolean

Loading state indicator.
open
open: boolean
Type : boolean
Default value : false

Indicates that the navigator node is expanded/collapsed.
parents
parents: NavigatorNode[]
Type : NavigatorNode[]
Default value : []

Navigator node parent nodes.
path
path: string
Type : string

The path to which the UI will be redirected after clicking the navigator node.
routerLinkExact
routerLinkExact: boolean
Type : boolean
Default value : true

Indicates whether the navigator node should be active based on matching the node path and the URL path. To match the URL exactly, set this option to true.

routerLinkExact set to true: When the URL path is set to /a/b/c and the node path to /a/b then the node will not be set active.

routerLinkExact set to false: When the URL path is set to /a/b/c and the node path to /a/b then the node will be set active.

Methods

addRoot
addRoot(nodeData: Partial)

Adds top nodes to the navigator tree structure. These nodes are the direct children of the root node. In the case of the cockpit application, such a node is, for example, the "Home" menu entry.

Parameters :
Name Type Optional Description
nodeData Partial<NavigatorNodeData> No

Data on the basis of which a new node is created.
Example : 
<div><pre class="line-numbers"><code class="language-ts">   * const nodeData: NavigatorNodeData = { label: &#39;Home&#39; } ;
   * const root: NavigatorNodeRoot = new NavigatorNodeRoot();
   *
   * // Based on the node data, a new node will be created and assigned to root.
   * root.addRoot(nodeData);
   *
   * const parentNode: NavigatorNode =  new NavigatorNode({ label: &#39;Configuration&#39;...});
   * const nodeData: NavigatorNodeData = { label: &#39;Exports&#39;, parent: parentNode } ;
   * const root: NavigatorNodeRoot = new NavigatorNodeRoot();
   *
   * // Based on the node data, parent node will be directly assigned to the root node, and newly created child node
   * // will be added to the parent node.
   * root.add(nodeData);
   *
   *</code></pre></div>
Returns : any
createNode
createNode(nodeData: string | object | NavigatorNodeData | NavigatorNode)

Creates a new navigator node.

Parameters :
Name Type Optional Description
nodeData string | object | NavigatorNodeData | NavigatorNode No

The data that serves as the basis for creating a new node.
Returns : any
add
add(node: NavigatorNode)

Adds a child navigator node to the node.

Parameters :
Name Type Optional Description
node NavigatorNode No

Child node.
Returns : void
dragEnd
dragEnd($event)

This event is fired when a drag operation has ended.

Parameters :
Name Optional Description
$event No

DOM event.
Returns : void
dragEnter
dragEnter($event)

This event is fired when a dragged element enters a valid drop target.

Parameters :
Name Optional Description
$event No

DOM event.
Returns : void
dragLeave
dragLeave($event)

This event is fired when a dragged element leaves a valid drop target.

Parameters :
Name Optional Description
$event No

DOM event.
Returns : void
dragStart
dragStart($event)

This event is fired when the user starts dragging an element.

Parameters :
Name Optional Description
$event No

DOM event.
Returns : void
drop
drop($event)

This event is fired when an element is dropped on a valid drop target.

Parameters :
Name Optional Description
$event No

DOM event.
Returns : void
empty
empty()

Removes children nodes.

Returns : void
expand
expand()

Expands the navigator node if it is collapsed.

Returns : void
find
find(predicate)

Returns a child navigator node based on the predicate.

Parameters :
Name Optional Description
predicate No

Filter criteria.
Example : 
<div><pre class="line-numbers"><code class="language-ts">   * // The function will compare the labels to the string and return a matching result.
   * // The capitalization of the characters does not matter (case insensitive).
   * const predicate = &#39;group1&#39;;
   * const childNode = parentNode.find(predicate);
   *
   * // Check: [lodash matches](https://lodash.com/docs/4.17.15#matches)
   * const predicate = { label: &#39;group2&#39; };
   * const childNode = parentNode.find(predicate);
   *</code></pre></div>
Returns : any
remove
remove(node: NavigatorNode)

Removes the child navigator node from the node.

Parameters :
Name Type Optional Description
node NavigatorNode No

Child node.
Returns : void
Protected sort
sort()

Sorts the children of the navigator node, by priority and name (ASC). The higher the priority, the higher the position in the hierarchy. For the same priority values, the alphabetical order will take precedence.

Returns : void
traverse
traverse(callback)

Performs a callback function recursively on each of the navigator node's children down the hierarchy.

Parameters :
Name Optional Description
callback No

Function to be called.
Example : 
<div><pre class="line-numbers"><code class="language-ts">   * const expandChild = (childNode) =&gt; childNode.expand();
   * parentNode.traverse(expandChild);
   *</code></pre></div>
Returns : void
update
update(data?: NavigatorNodeData)

Updates the navigator node.

Parameters :
Name Type Optional Description
data NavigatorNodeData Yes

Data to be upated.
Returns : void
Protected updateChildren
updateChildren()

Updates the navigator node by sorting its children and also checking their visibility.

Returns : void
Protected updateHidden
updateHidden()

Checks if the navigator node should be hidden based on the visibility of its child nodes.

Returns : void

result-matching ""

    No results matching ""