Templates
You can control how the FileSelect displays the file list by using either the FileTemplateDirective or FileInfoTemplateDirective depending on the desired level of customization.
The following values are available as context variables in both templates:
- let-files—A reference to the files which are associated with the current item.
- let-state—A reference to the current state of each file.
File Template
The FileTemplateDirective allows full customization of the items in the file list. Therefore, all built-in items, such as the file size, name and icon, will be replaced by the content provided inside the template.
To use the FileTemplateDirective, nest the <ng-template> tag inside the <kendo-fileselect> selector and apply the kendoFileSelectFileTemplate directive to it.
File Info Template
The FileInfoTemplateDirective is used for customizing the general file information section, while preserving the rest of the built-in features of the file list, such as the file icon.
To use the FileInfoTemplateDirective, nest the <ng-template> tag inside the <kendo-fileselect> selector and apply the kendoFileSelectFileInfoTemplate directive to it.