core/list-group/list-item-action.component.ts
Actions are functions that can be executed on the current list item. They are displayed next to the item and can be grouped in a dropdown.
Example :<c8y-li>
<c8y-li-action (click)="deleteDevice(device.id)" icon="times">
Delete
</c8y-li-action>
<c8y-li-action (click)="(false)" icon="rocket">
Launch to space
</c8y-li-action>
</c8y-li>
| providers |
{
provide: PRODUCT_EXPERIENCE_EVENT_SOURCE, useExisting: forwardRef(() => ListItemActionComponent)
}
|
| selector | c8y-list-item-action, c8y-li-action |
| templateUrl | ./list-item-action.component.html |
Properties |
Inputs |
Outputs |
constructor(gainsightService: GainsightService)
|
||||||
|
Parameters :
|
| disabled |
Type : boolean
|
Default value : false
|
|
Defines if the action is disabled or not. |
| icon |
Type : string
|
|
The name of the icon to use. |
| label |
Type : string
|
|
The label to display (you can alternatively use content projection to display the label). |
| click |
Type : EventEmitter
|
|
An EventEmitter to determine what to do if the action is triggered. |
| productExperienceEvent |
Type : ProductExperienceEvent
|
|
The product experience event to be triggered when the action is clicked. |
<ng-template #template>
<li>
<button
title="{{ label | translate }}"
(click)="click.emit($event)"
data-cy="c8y-li-action--btn"
[disabled]="disabled"
>
<i
[c8yIcon]="icon"
*ngIf="icon"
></i>
<span *ngIf="label">{{ label | translate }}</span>
<ng-content></ng-content>
</button>
</li>
</ng-template>