TableColumn

interface TableColumn<TRow extends Row = any>

Column Type

Properties

bindAsUnsafeHtml

bindAsUnsafeHtml?: boolean

By default, the property is bound using normal data binding <span></span>. If this property is set to true, the property will be bound as <span [innerHTML]="content" />.

DANGER If enabling this feature, make sure the source of the data is trusted. This can be a vector for HTML injection attacks.

canAutoResize

canAutoResize?: boolean

Whether the column can automatically resize to fill extra space. Default value: true.

cellClass

cellClass?: string | ((data: {
        row: TRow;
        group?: TRow[];
        column: TableColumn<TRow>;
        value: any;
        rowHeight: number;
    }) => string | Record<string, boolean>)

CSS classes to apply to the body cell.

cellTemplate

cellTemplate?: TemplateRef<CellContext<TRow>>

Template used to render body cells.

checkboxable

checkboxable?: boolean

Whether the column displays a selection checkbox. Only applies when selection mode is checkbox.

comparator

comparator?: (valueA: any, valueB: any, rowA: TRow, rowB: TRow) => number

Custom client-side sort comparator. It receives cell values and their respective rows; a standard two-argument comparison function is also supported.

draggable

draggable?: boolean

Whether the column can be dragged to reorder it. Default value: true.

flexGrow

flexGrow?: number

Grow factor relative to other columns. Available extra width is distributed proportionally according to all columns' flexGrow values. Default value: 0.

frozenLeft

frozenLeft?: boolean

Whether the column is frozen to the left. Default value: false.

frozenRight

frozenRight?: boolean

Whether the column is frozen to the right. Default value: false.

ghostCellTemplate

ghostCellTemplate?: TemplateRef<any>

Ghost Cell template ref

headerCheckboxable

headerCheckboxable?: boolean

Whether the header displays a selection checkbox. Only applies when selection mode is checkbox.

headerClass

headerClass?: string | ((data: {
        column: TableColumn;
    }) => string | Record<string, boolean>)

CSS classes to apply to the header cell.

headerTemplate

headerTemplate?: TemplateRef<HeaderCellContext>

Template used to render header cells.

isTreeColumn

isTreeColumn?: boolean

Is tree displayed on this column

maxWidth

maxWidth?: number

Maximum column width in pixels.

minWidth

minWidth?: number

Minimum column width in pixels.

name

name?: string

Column label. When omitted, the property value is used and decamelized.

pipe

pipe?: PipeTransform

Custom pipe used to transform cell values.

prop

prop?: TableColumnProp

Property used to bind row values. It can be a nested property path or a numeric index.

When omitted, the name is converted to camel case.

resizeable

resizeable?: boolean

Whether the user can manually resize the column. Default value: true.

sortable

sortable?: boolean

Whether row values can be sorted by this column. Default value: true.

summaryFunc

summaryFunc?: ((cells: any[]) => any) | null

Summary function

Null and undefined have different meanings: - undefined will use the default summary function - null will not compute a summary

summaryTemplate

summaryTemplate?: TemplateRef<any>

Summary cell template ref

treeLevelIndent

treeLevelIndent?: number

Width of the tree level indent

treeToggleTemplate

treeToggleTemplate?: any

Tree toggle template ref

width

width?: number

Default column width in pixels. Default value: 150.