@wf-dynamic-forms/ui-kendo NPM

NG Dynamic Forms Kendo UI

Installation

npm i @wf-dynamic-forms/ui-kendo -S

Import

@NgModule({

    imports: [DynamicFormsKendoUIModule]
})

export class AppModule {}

Usage

with DynamicKendoFormComponent:

<form [formGroup]="myFormGroup">

    <dynamic-kendo-form [group]="myFormGroup"
                        [model]="myFormModel"></dynamic-kendo-form>
</form>

with DynamicKendoFormControlComponent:

<form [formGroup]="myFormGroup">

    <dynamic-kendo-form-control *ngFor="let controlModel of myFormModel"
                                [group]="myFormGroup"
                                [model]="controlModel"></dynamic-kendo-form-control>
</form>

Form Controls

Control	Model	Required Property
AutoComplete	`DynamicInputModel`	`list`
Calendar	`DynamicDatepickerModel`	`inline: true`
Checkbox	`DynamicCheckboxModel`	–
Checkbox Group	`DynamicCheckboxGroupModel`	–
DateInput	`DynamicInputModel`	`inputType: "date"`
DatePicker	`DynamicDatepickerModel`	–
DropDownList	`DynamicSelectModel`	–
MaskedTextBox	`DynamicInputModel`	`mask`
MultiSelect	`DynamicSelectModel`	`multiple: true`
NumericTextBox	`DynamicInputModel`	`inputType: "number"`
Radio Button	`DynamicRadioGroupModel`	–
Slider	`DynamicSliderModel`	–
Switch	`DynamicSwitchModel`	–
TextArea	`DynamicTextAreaModel`	–
TextBox	`DynamicInputModel`	–
TimePicker	`DynamicTimePickerModel`	–
Upload	`DynamicFileUploadModel`	–

Custom UI Events

<form [formGroup]="myFormGroup">

    <dynamic-kendo-form [group]="myFormGroup"
                        [model]="myFormModel"
                        (kendoEvent)="onKendoEvent($event)"></dynamic-kendo-form>
</form>