core/navigator/navigator-outlet.component.ts
The component shows all nodes that have been added to the navigator. In addition, it allows you to add a header and a footer to the navigator.
<c8y-navigator-outlet [nodes]="navigatorService.items$ | async" [open]="isOpen">
<header class="navigator-slot-top"></header>
<footer class="navigator-slot-bottom"></footer>
</c8y-navigator-outlet>| selector | c8y-navigator-outlet, c8y-ui-navigator |
| templateUrl | ./navigator-outlet.component.html |
Properties |
Methods |
Inputs |
constructor(headerService: HeaderService, ngZone: NgZone)
|
|||||||||
|
Parameters :
|
| nodes |
Type : NavigatorNode[]
|
|
Navigator nodes list. |
| open |
Type : boolean
|
Default value : true
|
|
Determines whether the navigator menu should be open/closed. |
| collapseNavigator | ||||||
collapseNavigator(from: "icon" | "expander" | "link")
|
||||||
|
Closes the navigator menu after clicking an item in the menu, in case of insufficient screen width.
Parameters :
Returns :
void
|
| isShown$ |
Type : BehaviorSubject<boolean>
|
Default value : new BehaviorSubject<boolean>(false)
|
|
Determines whether the navigator pane should be rendered. |
<nav class="navigator" *ngIf="isShown$ | async" [ngClass]="{ open: open }">
<ng-content select=".navigator-slot-top"></ng-content>
<div class="navigatorContent">
<c8y-navigator-node
(nodeClick)="collapseNavigator($event)"
[node]="node"
*ngFor="let node of nodes; trackBy: trackByPathOrLabel"
[isRoot]="true"
></c8y-navigator-node>
</div>
<ng-content select=".navigator-slot-bottom"></ng-content>
</nav>