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.
<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 |
Methods |
Inputs |
Outputs |
HostListeners |
constructor(gainsightService: GainsightService)
|
||||||
|
Parameters :
|
| 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. |
| click |
Arguments : '$event.target'
|
click(event: HTMLElement)
|
| onClick | ||||||
onClick(event: HTMLElement)
|
||||||
Decorators :
@HostListener('click', ['$event.target'])
|
||||||
|
Parameters :
Returns :
void
|
| productExperienceEvent |
Type : ProductExperienceEvent
|
<ng-template #template>
<li>
<button title="{{ label | translate }}" (click)="click.emit($event)">
<i [c8yIcon]="icon" *ngIf="icon"></i>
<span *ngIf="label">{{ label | translate }}</span>
<ng-content></ng-content>
</button>
</li>
</ng-template>