UNPKG

@progress/kendo-angular-listview

Version:

Kendo UI Angular listview component

54 lines (53 loc) 2.77 kB
/**----------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the project root for more information *-------------------------------------------------------------------------------------------*/ import { Directive, TemplateRef, Optional } from '@angular/core'; import * as i0 from "@angular/core"; /** * Defines the edit template of the ListView ([see example]({% slug editing_template_forms_listview %})). * Helps you customize the content of the edited items. To define the template, nest an `<ng-template>` * tag with the `kendoListViewEditTemplate` directive inside a `<kendo-listview>` tag. * * The template context contains the following fields: * - `formGroup`&mdash;The current [`FormGroup`](link:site.data.urls.angular['formgroupapi']). When you use the ListView inside [Template-Driven Forms](link:site.data.urls.angular['forms']), it will be `undefined`. * - `itemIndex`&mdash;The current item index. When inside a new item, `itemIndex` is `-1`. * - `dataItem`&mdash;The current data item. * - `isNew`&mdash;The state of the current item. * * * @example * ```typescript * @Component({ * template: ` * <kendo-listview [data]="items"> * <ng-template kendoListViewEditTemplate let-dataItem let-formGroup="formGroup"> * <div class="edit-form"> * <input [(ngModel)]="dataItem.name" [formControl]="formGroup.get('name')" /> * <button kendoListViewSaveCommand>Save</button> * <button kendoListViewCancelCommand>Cancel</button> * </div> * </ng-template> * </kendo-listview> * ` * }) * export class AppComponent { } * ``` */ export class EditTemplateDirective { templateRef; constructor(templateRef) { this.templateRef = templateRef; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditTemplateDirective, deps: [{ token: i0.TemplateRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: EditTemplateDirective, isStandalone: true, selector: "[kendoListViewEditTemplate]", ngImport: i0 }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: EditTemplateDirective, decorators: [{ type: Directive, args: [{ selector: '[kendoListViewEditTemplate]', standalone: true }] }], ctorParameters: () => [{ type: i0.TemplateRef, decorators: [{ type: Optional }] }] });