Custom Editors with Reactive Forms

The TreeList enables you to use templates and customize its built-in editing functionality in Reactive Forms.

Setup

The following example demonstrates how to use the EditTemplateDirective column options and the Reactive Forms to build custom AutoComplete and NumericTextBox editors. It also demonstrates how to integrate custom validation messages, which utilize the built-in Kendo UI styling and the Kendo UI for Angular Popup component.

To align the validation popup with the editor, use a custom directive to expose the ElementRef of the custom editor component and link it to the anchor property of the Popup.

Suggested Links

• EditTemplateDirective
• Built-In Editing Directives
• Editing in Reactive Forms
• API Reference of the TreeListComponent
• Overview of Editing
• API Index of the TreeList