core/action/action-outlet.component.ts
This component is used as the outlet to show the action list. In a c8ycli app it is by default placed on the header component near app-switcher.
| selector | c8y-action-outlet |
| templateUrl | ./action-outlet.component.html |
Properties |
Methods |
Inputs |
| items |
Type : Action[]
|
Default value : []
|
|
The current items to display in the action dropdown. |
| getByPriority |
getByPriority()
|
|
Returns the items ordered by priority.
Returns :
any
|
| invoke | ||||
invoke(action)
|
||||
|
Invokes action after an action is clicked.
Parameters :
Returns :
void
|
| isPageToolbarExpanded |
Default value : false
|
|
Identifies if in a mobile view the toolbar is expanded or not. |
<div class="dropdown" dropdown *ngIf="items && items.length > 0">
<button
type="button"
class="main-header-button dropdown-toggle c8y-dropdown"
dropdownToggle
aria-haspopup="true"
aria-expanded="true"
title="{{'Actions' | translate}}">
<i [c8yIcon]="'plus-circle'" class="icon-2x"></i>
</button>
<ul class="dropdown-menu cog-dropdown" *dropdownMenu>
<ng-container *ngFor="let item of getByPriority()">
<ng-container *c8yOutlet="item.template"></ng-container>
<li *ngIf="item.label">
<button title="{{ item.label | translate }}" [attr.disabled]="item.disabled ? 'disabled' : null" (click)="invoke(item)">
<i *ngIf="item.icon" [c8yIcon]="item.icon"></i>{{item.label | translate}}
</button>
</li>
</ng-container>
</ul>
</div>