New to Kendo UI for AngularStart a free 30-day trial

Templates

Updated over 6 months ago

The MultiColumnComboBox provides templates that enable you to customize the content of its suggestion list table and elements.

Cell Template

To customize the content of the cells in a specified column, nest an <ng-template> tag with the kendoMultiColumnComboBoxColumnCellTemplate directive inside the targeted <kendo-combobox-column> tag.

The current column and data items are available as context variables:

  • let-dataItem="dataItem" (any)—The current data item. Also available as implicit context variable.
  • let-column="column" (ColumnComponent)—The current column configuration object.
Change Theme
Theme
Loading ...

Column Header Template

To customize the content of the column header in a specified column, nest an <ng-template> tag with the kendoMultiColumnComboBoxColumnHeaderTemplate directive inside the targeted <kendo-combobox-column> tag.

Change Theme
Theme
Loading ...

Header Template

To render a list header element above the suggestion list, nest an <ng-template> tag with a kendoMultiColumnComboBoxHeaderTemplate directive inside a <kendo-multicolumncombobox> tag.

Change Theme
Theme
Loading ...

To render a list footer element below the suggestion list, nest an <ng-template> tag with a kendoMultiColumnComboBoxFooterTemplate directive inside a <kendo-multicolumncombobox> tag.

Change Theme
Theme
Loading ...

No-Data Template

To customize the content of the suggestion list when no data is available, nest an <ng-template> tag with a kendoMultiColumnComboBoxNoDataTemplate directive inside a <kendo-multicolumncombobox> tag.

Change Theme
Theme
Loading ...

Group Header Template

To customize the content of the group headers in the list, nest an <ng-template> tag with a kendoMultiColumnComboBoxGroupTemplate directive inside a <kendo-multicolumncombobox> tag.

The current group name is available as implicit context variable (let-groupName).

Change Theme
Theme
Loading ...

Fixed Group Header Template

To customize the content of the group header that is fixed above the list, nest an <ng-template> tag with a kendoMultiColumnComboBoxFixedGroupTemplate directive inside a <kendo-multicolumncombobox> tag.

The current group name is available as an implicit context variable (let-groupName).

Change Theme
Theme
Loading ...