diff --git a/demo/hello.ts b/demo/hello.ts index 574e54745..b804642df 100644 --- a/demo/hello.ts +++ b/demo/hello.ts @@ -360,12 +360,20 @@ export class HelloApp { }, }, { - key: 'nested.arrays.0', + key: 'nested.arrays.0.item', + type: 'input', + templateOptions: { + label: 'Array with dots', + }, + defaultValue: 'Default Value A', + parsers: [(value) => (value || '').toUpperCase()], + }, { + key: 'nested.arrays[1].item', type: 'input', templateOptions: { label: 'Array property', }, - defaultValue: 'Default Value', + defaultValue: 'Default Value B', parsers: [(value) => (value || '').toUpperCase()], }, { type: 'repeatSection', @@ -433,11 +441,6 @@ export class HelloApp { sports: false, languages: true, }, - nested: { - property: { - magic: 'Nested property Content', - }, - }, investments: [ { investmentName: 'Formly', diff --git a/src/core/services/formly.form.builder.ts b/src/core/services/formly.form.builder.ts index 273d7b3e7..0ec6b50e4 100644 --- a/src/core/services/formly.form.builder.ts +++ b/src/core/services/formly.form.builder.ts @@ -3,6 +3,7 @@ import { FormGroup, FormArray, FormControl, AbstractControl, Validators } from ' import { FormlyConfig } from './formly.config'; import { evalStringExpression, evalExpressionValueSetter, evalExpression, getFieldId, assignModelValue, isObject } from './../utils'; import { FormlyFieldConfig } from '../components/formly.field.config'; +import { getKeyPath } from '../utils'; @Injectable() export class FormlyFormBuilder { @@ -49,17 +50,17 @@ export class FormlyFormBuilder { if (field.defaultValue) { this.defaultPath = path; } - path = path.split('.'); + path = getKeyPath({key: field.key}); } if (path.length > 1) { const rootPath = path.shift(); - let nestedForm = (form.get(rootPath) ? form.get(rootPath) : new FormGroup({}, field.validators ? field.validators.validation : undefined, field.asyncValidators ? field.asyncValidators.validation : undefined)); - if (!form.get(rootPath)) { + let nestedForm = (form.get(rootPath.toString()) ? form.get(rootPath.toString()) : new FormGroup({}, field.validators ? field.validators.validation : undefined, field.asyncValidators ? field.asyncValidators.validation : undefined)); + if (!form.get(rootPath.toString())) { form.addControl(rootPath, nestedForm); } if (!model[rootPath]) { - model[rootPath] = isNaN(rootPath) ? {} : []; + model[rootPath] = isNaN(path[0]) ? {} : []; } const originalKey = field.key; @@ -71,7 +72,7 @@ export class FormlyFormBuilder { this.formlyConfig.getMergedField(field); this.addFormControl(form, field, model[path[0]] || field.defaultValue || ''); if (field.defaultValue && !model[path[0]]) { - let path = this.defaultPath.split('.'); + let path: any = getKeyPath({key: this.defaultPath}); path = path.pop(); assignModelValue(this.model, path, field.defaultValue); this.defaultPath = undefined; diff --git a/src/core/utils.ts b/src/core/utils.ts index 9adedac9b..8a1f69c49 100644 --- a/src/core/utils.ts +++ b/src/core/utils.ts @@ -66,7 +66,7 @@ export function getFieldModel(model: any, field: FormlyFieldConfig, constructEmp export function assignModelValue(model, path, value) { if (typeof path === 'string') { - path = path.split('.'); + path = getKeyPath({key: path}); } if (path.length > 1) { @@ -82,7 +82,7 @@ export function assignModelValue(model, path, value) { export function getValueForKey(model, path) { if (typeof path === 'string') { - path = path.split('.'); + path = getKeyPath({key: path}); } if (path.length > 1) { const e = path.shift();