### File

`packages/ecl/components/ecl-table/ecl-table.directive.ts`

### Extends

`ECLBaseDirective`

### Implements

`AfterContentInit` `OnInit`

### Metadata

Selector | `[eclTableHeader]`

### Index

###### Properties
sortOrder
###### Methods
onClick removeAriaSort getCssClasses
###### Inputs
eclSortable id scope sortButtonAriaLabel class e2eAttr tabindex
###### Outputs
sort
###### HostBindings
attr.aria-sort class
###### HostListeners
click
###### Accessors
cssClasses

### Inputs

eclSortable
Type : `any`
Default value : `null`
Enables sorting on the header. Also sets the `data-ecl-table-sort-toggle` attribute. Acts as the unique identifier for the column when sorting.

id
Type : `string`
HTML `id` attribute of the table header cell. If not provided, a UUID will be generated.

scope
Type : `string`
Default value : `'col'`
Scope of the table header. Default is `col`. Sets the `scope` attribute.

sortButtonAriaLabel
Type : `string`
Aria-label for the sort button that will be injected into the header cell.

class
Type : `string`

e2eAttr
Type : `any`

tabindex
Type : `number`

### Outputs

sort
Type : `EventEmitter`
Emits an `EclSortTableEvent` when the header is clicked and sorting is triggered.

### HostBindings

attr.aria-sort
Type : `SortOrder`
Default value : `null`
Current sort order of the column (`ascending`, `descending`, or `null`). This sets the `aria-sort` attribute used for accessibility.

class
Type : `string`
Computes the CSS classes applied to the header element.

### HostListeners

click
Arguments : `'$event'`
Handles click events on the header. Cycles through sort orders: `null` -> `ascending` -> `descending` -> `null`. Emits a `EclSortTableEvent` with the updated sort state and column identifier. Click triggers 1 -> asc sorting, 2 -> desc sorting then 3 -> initial sorting

### Methods

onClick
`onClick(evt: Event)`
Decorators : `@HostListener('click', ['$event'])`
Handles click events on the header. Cycles through sort orders: `null` -> `ascending` -> `descending` -> `null`. Emits a `EclSortTableEvent` with the updated sort state and column identifier. Click triggers 1 -> asc sorting, 2 -> desc sorting then 3 -> initial sorting Parameters :
Name | Type | Optional
evt | `Event` | No
Returns : `void`

removeAriaSort
`removeAriaSort()`
Clears the `aria-sort` attribute, used to visually and semantically reset previous sort state. Remove the dark arrow for current sorting from prev sorted column Returns : `void`

getCssClasses
`getCssClasses(rootClass: string)`
Parameters :
Name | Type | Optional
rootClass | `string` | No
Returns : `string`

### Properties

sortOrder
Type : `SortOrder`
Default value : `null`
Decorators : `@HostBinding('attr.aria-sort')`
Current sort order of the column (`ascending`, `descending`, or `null`). This sets the `aria-sort` attribute used for accessibility.

### Accessors

cssClasses
get `cssClasses()`
Computes the CSS classes applied to the header element. Returns : `string`

# results matching ""

# No results matching ""