GridCell - Angular

Represents a cell within a grid row. It is the primary focusable element within the grid. It can be disabled and can have its selection state managed through the selected input.

API

class GridCell {
  readonly element: HTMLElement;
  readonly active: Signal<any>;
  readonly textDirection: WritableSignal<Direction>;
  readonly @Input() id: InputSignal<any>;
  readonly @Input() role: InputSignal<"gridcell" | "columnheader" | "rowheader">;
  readonly @Input() rowSpan: InputSignal<number>;
  readonly @Input() colSpan: InputSignal<number>;
  readonly @Input() rowIndex: InputSignal<number | undefined>;
  readonly @Input() colIndex: InputSignal<number | undefined>;
  readonly @Input() disabled: InputSignalWithTransform<boolean, unknown>;
  readonly @Input() @Output('selectedChange') selected: ModelSignal<boolean>;
  readonly @Input() selectable: InputSignal<boolean>;
  readonly @Input() orientation: InputSignal<"vertical" | "horizontal">;
  readonly @Input() wrap: InputSignalWithTransform<boolean, unknown>;
  readonly @Input() tabindex: InputSignal<number | undefined>;
}

element

HTMLElement

A reference to the host element.

active

Signal<any>

Whether the cell is currently active (focused).

textDirection

WritableSignal<Direction>

Text direction.

id

InputSignal<any>

A unique identifier for the cell.

role

InputSignal<"gridcell" | "columnheader" | "rowheader">

The ARIA role for the cell.

rowSpan

InputSignal<number>

The number of rows the cell should span.

colSpan

InputSignal<number>

The number of columns the cell should span.

rowIndex

InputSignal<number | undefined>

The index of this cell's row within the grid.

colIndex

InputSignal<number | undefined>

The index of this cell's column within the grid.

disabled

InputSignalWithTransform<boolean, unknown>

Whether the cell is disabled.

selected

ModelSignal<boolean>

Whether the cell is selected.

selectable

InputSignal<boolean>

Whether the cell is selectable.

orientation

InputSignal<"vertical" | "horizontal">

Orientation of the widgets in the cell.

wrap

InputSignalWithTransform<boolean, unknown>

Whether widgets navigation wraps.

tabindex

InputSignal<number | undefined>

The tabindex override.

Description

Represents a cell within a grid row. It is the primary focusable element within the grid. It can be disabled and can have its selection state managed through the selected input.

<td ngGridCell [disabled]="isDisabled" [(selected)]="isSelected">
  Cell Content
</td>