| title | description | template | last_updated | redirect_from | related | |||||||||||||||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Table Column Type List |
This document provides details about the Table Column Type List in the Components Library. |
concept-topic-template |
Jan 11, 2024 |
|
|
This document explains the Table Column Type List in the Components library.
Table Column List is an Angular Component that provides a list of Table Column components with defined types via the table-column-renderer component and displays two columns by default, with the rest appearing in the @spryker/popover component.
Check out an example usage of the Table Column List in the @spryker/table config:
<spy-table
[config]="{
...,
columns: [
...,
{
id: 'sku',
title: 'sku',
type: 'list',
typeOptions: {
limit: 2,
type: 'text',
typeOptions: {
text: '${displayValue}',
},
},
},
...,
],
}"
>
</spy-table>Register the component:
declare module '@spryker/table' {
interface TableColumnTypeRegistry {
list: TableColumnListConfig;
}
}
@NgModule({
imports: [
TableModule.forRoot(),
TableModule.withColumnComponents({
list: TableColumnListComponent,
}),
TableColumnListModule,
],
})
export class RootModule {}Below you can find interfaces for the Table Column List:
interface TableColumnListConfigInner {
type?: string;
typeOptions?: Object;
typeChildren?: TableColumnListConfigInner[];
}
interface TableColumnListConfig extends TableColumnListConfigInner {
limit: number; // 2 - by default
}