@ngx-formly/core 9.0.0 → 10.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -0
- package/fesm2022/ngx-formly-core-json-schema.mjs +8 -6
- package/fesm2022/ngx-formly-core-json-schema.mjs.map +1 -1
- package/fesm2022/ngx-formly-core-preset.mjs +4 -4
- package/fesm2022/ngx-formly-core-select.mjs +10 -10
- package/fesm2022/ngx-formly-core-testing.mjs +3 -3
- package/fesm2022/ngx-formly-core.mjs +141 -77
- package/fesm2022/ngx-formly-core.mjs.map +1 -1
- package/package.json +9 -8
- package/{json-schema/index.d.ts → types/ngx-formly-core-json-schema.d.ts} +5 -0
- package/{index.d.ts → types/ngx-formly-core.d.ts} +7 -2
- /package/{preset/index.d.ts → types/ngx-formly-core-preset.d.ts} +0 -0
- /package/{select/index.d.ts → types/ngx-formly-core-select.d.ts} +0 -0
- /package/{testing/index.d.ts → types/ngx-formly-core-testing.d.ts} +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Type, TemplateRef, ComponentRef, ChangeDetectorRef, ɵNoopNgZone as _NoopNgZone, VERSION, Input, ViewChildren, Directive, ChangeDetectionStrategy, Component, Injectable, Injector, ViewContainerRef, ViewChild, Optional, InjectionToken, inject, Inject, EventEmitter, ContentChildren, Output, DOCUMENT, NgModule } from '@angular/core';
|
|
2
|
+
import { Type, TemplateRef, ComponentRef, ChangeDetectorRef, ɵNoopNgZone as _NoopNgZone, VERSION, Input, ViewChildren, Directive, ChangeDetectionStrategy, Component, Injectable, Injector, ViewContainerRef, ViewChild, Optional, InjectionToken, inject, Inject, EventEmitter, DestroyRef, PendingTasks, ContentChildren, Output, DOCUMENT, NgModule } from '@angular/core';
|
|
3
3
|
import { isObservable, Observable, Subject, of, merge } from 'rxjs';
|
|
4
4
|
import * as i2 from '@angular/forms';
|
|
5
5
|
import { AbstractControl, UntypedFormArray, UntypedFormGroup, FormControl, UntypedFormControl, Validators, NgControl } from '@angular/forms';
|
|
@@ -466,7 +466,13 @@ let FieldExpressionExtension$1 = class FieldExpressionExtension {
|
|
|
466
466
|
else if (expr instanceof Observable) {
|
|
467
467
|
field._expressions[key] = {
|
|
468
468
|
value$: expr.pipe(tap((v) => {
|
|
469
|
-
|
|
469
|
+
if (['props.disabled', 'templateOptions.disabled'].includes(key)) {
|
|
470
|
+
field._expressions[key].callback = this.parseExpressions(field, key, () => v).callback;
|
|
471
|
+
field._expressions[key].callback(true);
|
|
472
|
+
}
|
|
473
|
+
else {
|
|
474
|
+
this.evalExpr(field, key, v);
|
|
475
|
+
}
|
|
470
476
|
field.options._detectChanges(field);
|
|
471
477
|
})),
|
|
472
478
|
};
|
|
@@ -523,8 +529,9 @@ let FieldExpressionExtension$1 = class FieldExpressionExtension {
|
|
|
523
529
|
}
|
|
524
530
|
}
|
|
525
531
|
parseExpressions(field, path, expr) {
|
|
532
|
+
const isDisabledExpression = ['props.disabled', 'templateOptions.disabled'].includes(path);
|
|
526
533
|
let parentExpression;
|
|
527
|
-
if (field.parent &&
|
|
534
|
+
if (field.parent && (path === 'hide' || isDisabledExpression)) {
|
|
528
535
|
const rootValue = (f) => {
|
|
529
536
|
return path === 'hide' ? f.hide : f.props.disabled;
|
|
530
537
|
};
|
|
@@ -546,6 +553,8 @@ let FieldExpressionExtension$1 = class FieldExpressionExtension {
|
|
|
546
553
|
try {
|
|
547
554
|
const exprValue = evalExpression(parentExpression ? (...args) => parentExpression(field) || expr(...args) : expr, { field }, [field.model, field.options.formState, field, ignoreCache]);
|
|
548
555
|
if (ignoreCache ||
|
|
556
|
+
(isDisabledExpression &&
|
|
557
|
+
(field.props.disabled !== !!exprValue || (exprValue && hasKey(field) && field.formControl?.enabled))) ||
|
|
549
558
|
(currentValue !== exprValue &&
|
|
550
559
|
(!isObject(exprValue) ||
|
|
551
560
|
isObservable(exprValue) ||
|
|
@@ -670,6 +679,10 @@ let FieldExpressionExtension$1 = class FieldExpressionExtension {
|
|
|
670
679
|
throw error;
|
|
671
680
|
}
|
|
672
681
|
if (['templateOptions.disabled', 'props.disabled'].includes(prop) && hasKey(field)) {
|
|
682
|
+
// Angular enables descendants without updating a group's disabled property.
|
|
683
|
+
if (value && field.formControl?.enabled) {
|
|
684
|
+
field.formControl.disable();
|
|
685
|
+
}
|
|
673
686
|
this.changeDisabledState(field, value);
|
|
674
687
|
}
|
|
675
688
|
}
|
|
@@ -722,6 +735,7 @@ var TokenType;
|
|
|
722
735
|
(function (TokenType) {
|
|
723
736
|
TokenType["IDENTIFIER"] = "IDENTIFIER";
|
|
724
737
|
TokenType["DOT"] = "DOT";
|
|
738
|
+
TokenType["OPTIONAL_DOT"] = "OPTIONAL_DOT";
|
|
725
739
|
TokenType["BRACKET_OPEN"] = "BRACKET_OPEN";
|
|
726
740
|
TokenType["BRACKET_CLOSE"] = "BRACKET_CLOSE";
|
|
727
741
|
TokenType["STRING"] = "STRING";
|
|
@@ -784,6 +798,10 @@ class Tokenizer {
|
|
|
784
798
|
tokens.push({ type: TokenType.PAREN_CLOSE, value: ')' });
|
|
785
799
|
this.pos++;
|
|
786
800
|
}
|
|
801
|
+
else if (char === '?' && this.peek() === '.') {
|
|
802
|
+
tokens.push({ type: TokenType.OPTIONAL_DOT, value: '?.' });
|
|
803
|
+
this.pos += 2;
|
|
804
|
+
}
|
|
787
805
|
else if (char === '?') {
|
|
788
806
|
tokens.push({ type: TokenType.TERNARY_QUESTION, value: '?' });
|
|
789
807
|
this.pos++;
|
|
@@ -960,6 +978,7 @@ class ExpressionParser {
|
|
|
960
978
|
}
|
|
961
979
|
parse() {
|
|
962
980
|
const expr = this.parseTernary();
|
|
981
|
+
this.consume(TokenType.EOF);
|
|
963
982
|
return (context) => expr(context);
|
|
964
983
|
}
|
|
965
984
|
parseTernary() {
|
|
@@ -1100,9 +1119,17 @@ class ExpressionParser {
|
|
|
1100
1119
|
// Read first identifier
|
|
1101
1120
|
path.push(this.consume(TokenType.IDENTIFIER).value);
|
|
1102
1121
|
// Read rest of path (dots and brackets)
|
|
1103
|
-
while (this.current().type === TokenType.DOT ||
|
|
1104
|
-
|
|
1105
|
-
|
|
1122
|
+
while (this.current().type === TokenType.DOT ||
|
|
1123
|
+
this.current().type === TokenType.OPTIONAL_DOT ||
|
|
1124
|
+
this.current().type === TokenType.BRACKET_OPEN) {
|
|
1125
|
+
const optional = this.current().type === TokenType.OPTIONAL_DOT;
|
|
1126
|
+
if (optional) {
|
|
1127
|
+
this.consume(TokenType.OPTIONAL_DOT);
|
|
1128
|
+
}
|
|
1129
|
+
if (this.current().type === TokenType.DOT || (optional && this.current().type !== TokenType.BRACKET_OPEN)) {
|
|
1130
|
+
if (!optional) {
|
|
1131
|
+
this.consume(TokenType.DOT);
|
|
1132
|
+
}
|
|
1106
1133
|
path.push(this.consume(TokenType.IDENTIFIER).value);
|
|
1107
1134
|
}
|
|
1108
1135
|
else {
|
|
@@ -1630,10 +1657,10 @@ class FieldType {
|
|
|
1630
1657
|
get formState() {
|
|
1631
1658
|
return this.options?.formState || {};
|
|
1632
1659
|
}
|
|
1633
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1634
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1660
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FieldType, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1661
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: FieldType, isStandalone: true, inputs: { field: "field" }, viewQueries: [{ propertyName: "_formlyControls", predicate: NgControl, descendants: true }], ngImport: i0 }); }
|
|
1635
1662
|
}
|
|
1636
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1663
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FieldType, decorators: [{
|
|
1637
1664
|
type: Directive
|
|
1638
1665
|
}], propDecorators: { _formlyControls: [{
|
|
1639
1666
|
type: ViewChildren,
|
|
@@ -1660,10 +1687,10 @@ class FormlyTemplateType extends FieldType {
|
|
|
1660
1687
|
this.sanitizer = sanitizer;
|
|
1661
1688
|
this.innerHtml = {};
|
|
1662
1689
|
}
|
|
1663
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1664
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1690
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyTemplateType, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1691
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: FormlyTemplateType, isStandalone: false, selector: "formly-template", usesInheritance: true, ngImport: i0, template: `<div [innerHtml]="template"></div>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1665
1692
|
}
|
|
1666
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1693
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyTemplateType, decorators: [{
|
|
1667
1694
|
type: Component,
|
|
1668
1695
|
args: [{
|
|
1669
1696
|
selector: 'formly-template',
|
|
@@ -1898,10 +1925,10 @@ class FormlyConfig {
|
|
|
1898
1925
|
this.types[name].wrappers = extendedType.wrappers;
|
|
1899
1926
|
}
|
|
1900
1927
|
}
|
|
1901
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1902
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1928
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1929
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyConfig, providedIn: 'root' }); }
|
|
1903
1930
|
}
|
|
1904
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1931
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyConfig, decorators: [{
|
|
1905
1932
|
type: Injectable,
|
|
1906
1933
|
args: [{ providedIn: 'root' }]
|
|
1907
1934
|
}] });
|
|
@@ -1913,10 +1940,10 @@ class FormlyTemplate {
|
|
|
1913
1940
|
ngOnChanges() {
|
|
1914
1941
|
this.name = this.name || 'formly-group';
|
|
1915
1942
|
}
|
|
1916
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1917
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1943
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyTemplate, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1944
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: FormlyTemplate, isStandalone: true, selector: "[formlyTemplate]", inputs: { name: ["formlyTemplate", "name"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
1918
1945
|
}
|
|
1919
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1946
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyTemplate, decorators: [{
|
|
1920
1947
|
type: Directive,
|
|
1921
1948
|
args: [{ selector: '[formlyTemplate]', standalone: true }]
|
|
1922
1949
|
}], ctorParameters: () => [{ type: i0.TemplateRef }], propDecorators: { name: [{
|
|
@@ -1924,19 +1951,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImpo
|
|
|
1924
1951
|
args: ['formlyTemplate']
|
|
1925
1952
|
}] } });
|
|
1926
1953
|
class LegacyFormlyTemplate extends FormlyTemplate {
|
|
1927
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1928
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1954
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyTemplate, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1955
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: LegacyFormlyTemplate, isStandalone: false, selector: "[formlyTemplate]", usesInheritance: true, ngImport: i0 }); }
|
|
1929
1956
|
}
|
|
1930
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1957
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyTemplate, decorators: [{
|
|
1931
1958
|
type: Directive,
|
|
1932
1959
|
args: [{ selector: '[formlyTemplate]', standalone: false }]
|
|
1933
1960
|
}] });
|
|
1934
1961
|
// workarround for https://github.com/angular/angular/issues/43227#issuecomment-904173738
|
|
1935
1962
|
class FormlyFieldTemplates {
|
|
1936
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1937
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1963
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyFieldTemplates, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
1964
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyFieldTemplates }); }
|
|
1938
1965
|
}
|
|
1939
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1966
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyFieldTemplates, decorators: [{
|
|
1940
1967
|
type: Injectable
|
|
1941
1968
|
}] });
|
|
1942
1969
|
|
|
@@ -2224,10 +2251,10 @@ class FormlyField {
|
|
|
2224
2251
|
templateFieldsSubs.forEach((unsubscribe) => unsubscribe());
|
|
2225
2252
|
};
|
|
2226
2253
|
}
|
|
2227
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2228
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2254
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyField, deps: [{ token: FormlyConfig }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: FormlyFieldTemplates, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2255
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: FormlyField, isStandalone: true, selector: "formly-field", inputs: { field: "field" }, viewQueries: [{ propertyName: "viewContainerRef", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], usesOnChanges: true, ngImport: i0, template: '<ng-template #container></ng-template>', isInline: true, styles: [":host:empty{display:none}\n"] }); }
|
|
2229
2256
|
}
|
|
2230
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2257
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyField, decorators: [{
|
|
2231
2258
|
type: Component,
|
|
2232
2259
|
args: [{ selector: 'formly-field', template: '<ng-template #container></ng-template>', standalone: true, styles: [":host:empty{display:none}\n"] }]
|
|
2233
2260
|
}], ctorParameters: () => [{ type: FormlyConfig }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: FormlyFieldTemplates, decorators: [{
|
|
@@ -2239,25 +2266,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImpo
|
|
|
2239
2266
|
args: ['container', { read: ViewContainerRef, static: true }]
|
|
2240
2267
|
}] } });
|
|
2241
2268
|
class LegacyFormlyField extends FormlyField {
|
|
2242
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2243
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2269
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyField, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2270
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: LegacyFormlyField, isStandalone: false, selector: "formly-field", usesInheritance: true, ngImport: i0, template: '<ng-template #container></ng-template>', isInline: true, styles: [":host:empty{display:none}\n"] }); }
|
|
2244
2271
|
}
|
|
2245
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyField, decorators: [{
|
|
2246
2273
|
type: Component,
|
|
2247
2274
|
args: [{ selector: 'formly-field', template: '<ng-template #container></ng-template>', standalone: false, styles: [":host:empty{display:none}\n"] }]
|
|
2248
2275
|
}] });
|
|
2249
2276
|
|
|
2250
2277
|
/** @ignore */
|
|
2251
2278
|
class FormlyGroup extends FieldType {
|
|
2252
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2253
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2279
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyGroup, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2280
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.25", type: FormlyGroup, isStandalone: false, selector: "formly-group", host: { properties: { "class": "field.fieldGroupClassName || \"\"" } }, usesInheritance: true, ngImport: i0, template: `
|
|
2254
2281
|
@for (f of field.fieldGroup; track $index) {
|
|
2255
2282
|
<formly-field [field]="f"></formly-field>
|
|
2256
2283
|
}
|
|
2257
2284
|
<ng-content></ng-content>
|
|
2258
2285
|
`, isInline: true, dependencies: [{ kind: "component", type: LegacyFormlyField, selector: "formly-field" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2259
2286
|
}
|
|
2260
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2287
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyGroup, decorators: [{
|
|
2261
2288
|
type: Component,
|
|
2262
2289
|
args: [{
|
|
2263
2290
|
selector: 'formly-group',
|
|
@@ -2340,6 +2367,7 @@ class FormlyFormBuilder {
|
|
|
2340
2367
|
this.injector = injector;
|
|
2341
2368
|
this.viewContainerRef = viewContainerRef;
|
|
2342
2369
|
this.parentForm = parentForm;
|
|
2370
|
+
this.initializedForms = new WeakSet();
|
|
2343
2371
|
if (configs) {
|
|
2344
2372
|
configs.forEach((c) => config.addConfig(c));
|
|
2345
2373
|
}
|
|
@@ -2354,21 +2382,43 @@ class FormlyFormBuilder {
|
|
|
2354
2382
|
if (!field.parent) {
|
|
2355
2383
|
this._setOptions(field);
|
|
2356
2384
|
}
|
|
2357
|
-
|
|
2358
|
-
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2363
|
-
|
|
2364
|
-
|
|
2365
|
-
|
|
2366
|
-
|
|
2385
|
+
const firstBuild = !field.parent && !this.initializedForms.has(field.form);
|
|
2386
|
+
let lastEmittedStatus;
|
|
2387
|
+
const subscription = firstBuild
|
|
2388
|
+
? field.form.statusChanges.subscribe((status) => (lastEmittedStatus = status))
|
|
2389
|
+
: undefined;
|
|
2390
|
+
if (firstBuild) {
|
|
2391
|
+
this.initializedForms.add(field.form);
|
|
2392
|
+
}
|
|
2393
|
+
try {
|
|
2394
|
+
disableTreeValidityCall(field.form, () => {
|
|
2395
|
+
this._build(field);
|
|
2396
|
+
// TODO: add test for https://github.com/ngx-formly/ngx-formly/issues/3910
|
|
2397
|
+
if (!field.parent || field.fieldArray) {
|
|
2398
|
+
// detect changes early to avoid reset value by hidden fields
|
|
2399
|
+
const options = field.options;
|
|
2400
|
+
if (field.parent && isHiddenField(field)) {
|
|
2401
|
+
// when hide is used in expression set defaul value will not be set until detect hide changes
|
|
2402
|
+
// which causes default value not set on new item is added
|
|
2403
|
+
options._hiddenFieldsForCheck?.push({ field, default: false });
|
|
2404
|
+
}
|
|
2405
|
+
options.checkExpressions?.(field, true);
|
|
2406
|
+
options._detectChanges?.(field);
|
|
2367
2407
|
}
|
|
2368
|
-
|
|
2369
|
-
|
|
2408
|
+
});
|
|
2409
|
+
}
|
|
2410
|
+
catch (error) {
|
|
2411
|
+
if (firstBuild) {
|
|
2412
|
+
this.initializedForms.delete(field.form);
|
|
2370
2413
|
}
|
|
2371
|
-
|
|
2414
|
+
throw error;
|
|
2415
|
+
}
|
|
2416
|
+
finally {
|
|
2417
|
+
subscription?.unsubscribe();
|
|
2418
|
+
}
|
|
2419
|
+
if (firstBuild && lastEmittedStatus !== field.form.status) {
|
|
2420
|
+
field.form.statusChanges.emit(field.form.status);
|
|
2421
|
+
}
|
|
2372
2422
|
}
|
|
2373
2423
|
_build(field) {
|
|
2374
2424
|
if (!field) {
|
|
@@ -2408,10 +2458,10 @@ class FormlyFormBuilder {
|
|
|
2408
2458
|
}
|
|
2409
2459
|
}
|
|
2410
2460
|
}
|
|
2411
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2412
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
2461
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyFormBuilder, deps: [{ token: FormlyConfig }, { token: i0.Injector }, { token: i0.ViewContainerRef, optional: true }, { token: i2.FormGroupDirective, optional: true }, { token: FORMLY_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2462
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyFormBuilder, providedIn: 'root' }); }
|
|
2413
2463
|
}
|
|
2414
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2464
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyFormBuilder, decorators: [{
|
|
2415
2465
|
type: Injectable,
|
|
2416
2466
|
args: [{ providedIn: 'root' }]
|
|
2417
2467
|
}], ctorParameters: () => [{ type: FormlyConfig }, { type: i0.Injector }, { type: i0.ViewContainerRef, decorators: [{
|
|
@@ -2472,7 +2522,11 @@ class FormlyForm {
|
|
|
2472
2522
|
this.fieldTemplates = fieldTemplates;
|
|
2473
2523
|
/** Event that is emitted when the model value is changed */
|
|
2474
2524
|
this.modelChange = new EventEmitter();
|
|
2525
|
+
/** Emits a build event asynchronously when the fields or form input changes. */
|
|
2526
|
+
this.fieldChange = new EventEmitter();
|
|
2475
2527
|
this.field = { type: 'formly-group' };
|
|
2528
|
+
this.destroyRef = inject(DestroyRef);
|
|
2529
|
+
this.pendingTasks = inject(PendingTasks);
|
|
2476
2530
|
this._modelChangeValue = {};
|
|
2477
2531
|
this.valueChangesUnsubscribe = () => { };
|
|
2478
2532
|
}
|
|
@@ -2490,6 +2544,14 @@ class FormlyForm {
|
|
|
2490
2544
|
this.builder.build(this.field);
|
|
2491
2545
|
this.valueChangesUnsubscribe = this.valueChanges();
|
|
2492
2546
|
}
|
|
2547
|
+
if (changes.fields || changes.form) {
|
|
2548
|
+
this.pendingTasks.run(async () => {
|
|
2549
|
+
await Promise.resolve();
|
|
2550
|
+
if (!this.destroyRef.destroyed) {
|
|
2551
|
+
this.fieldChange.emit({ field: this.field, type: 'build', value: this.form });
|
|
2552
|
+
}
|
|
2553
|
+
});
|
|
2554
|
+
}
|
|
2493
2555
|
}
|
|
2494
2556
|
ngOnDestroy() {
|
|
2495
2557
|
this.valueChangesUnsubscribe();
|
|
@@ -2535,10 +2597,10 @@ class FormlyForm {
|
|
|
2535
2597
|
Object.keys(field).forEach((p) => (this.field[p] = field[p]));
|
|
2536
2598
|
}
|
|
2537
2599
|
}
|
|
2538
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2539
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2600
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyForm, deps: [{ token: FormlyFormBuilder }, { token: FormlyConfig }, { token: i0.NgZone }, { token: FormlyFieldTemplates }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2601
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: FormlyForm, isStandalone: true, selector: "formly-form", inputs: { form: "form", model: "model", fields: "fields", options: "options" }, outputs: { modelChange: "modelChange", fieldChange: "fieldChange" }, providers: [FormlyFormBuilder, FormlyFieldTemplates], queries: [{ propertyName: "templates", predicate: FormlyTemplate }], usesOnChanges: true, ngImport: i0, template: '<formly-field [field]="field"></formly-field>', isInline: true, dependencies: [{ kind: "component", type: FormlyField, selector: "formly-field", inputs: ["field"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2540
2602
|
}
|
|
2541
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2603
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyForm, decorators: [{
|
|
2542
2604
|
type: Component,
|
|
2543
2605
|
args: [{
|
|
2544
2606
|
selector: 'formly-form',
|
|
@@ -2558,6 +2620,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImpo
|
|
|
2558
2620
|
type: Input
|
|
2559
2621
|
}], modelChange: [{
|
|
2560
2622
|
type: Output
|
|
2623
|
+
}], fieldChange: [{
|
|
2624
|
+
type: Output
|
|
2561
2625
|
}], templates: [{
|
|
2562
2626
|
type: ContentChildren,
|
|
2563
2627
|
args: [FormlyTemplate]
|
|
@@ -2566,10 +2630,10 @@ class LegacyFormlyForm extends FormlyForm {
|
|
|
2566
2630
|
set templates(templates) {
|
|
2567
2631
|
this.fieldTemplates.templates = templates;
|
|
2568
2632
|
}
|
|
2569
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2570
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2633
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyForm, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2634
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: LegacyFormlyForm, isStandalone: false, selector: "formly-form", providers: [FormlyFormBuilder, FormlyFieldTemplates], queries: [{ propertyName: "templates", predicate: LegacyFormlyTemplate }], usesInheritance: true, ngImport: i0, template: '<formly-field [field]="field"></formly-field>', isInline: true, dependencies: [{ kind: "component", type: LegacyFormlyField, selector: "formly-field" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2571
2635
|
}
|
|
2572
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2636
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyForm, decorators: [{
|
|
2573
2637
|
type: Component,
|
|
2574
2638
|
args: [{
|
|
2575
2639
|
selector: 'formly-form',
|
|
@@ -2763,10 +2827,10 @@ class FormlyAttributes {
|
|
|
2763
2827
|
removeAttribute(attr) {
|
|
2764
2828
|
this.renderer.removeAttribute(this.elementRef.nativeElement, attr);
|
|
2765
2829
|
}
|
|
2766
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2767
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2830
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyAttributes, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: DOCUMENT }, { token: FormlyField, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2831
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: FormlyAttributes, isStandalone: true, selector: "[formlyAttributes]", inputs: { field: ["formlyAttributes", "field"], id: "id" }, host: { listeners: { "change": "onHostChange($event)" } }, usesOnChanges: true, ngImport: i0 }); }
|
|
2768
2832
|
}
|
|
2769
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2833
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyAttributes, decorators: [{
|
|
2770
2834
|
type: Directive,
|
|
2771
2835
|
args: [{
|
|
2772
2836
|
selector: '[formlyAttributes]',
|
|
@@ -2787,10 +2851,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImpo
|
|
|
2787
2851
|
type: Input
|
|
2788
2852
|
}] } });
|
|
2789
2853
|
class LegacyFormlyAttributes extends FormlyAttributes {
|
|
2790
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2791
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2854
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyAttributes, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
2855
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: LegacyFormlyAttributes, isStandalone: false, selector: "[formlyAttributes]", host: { listeners: { "change": "onHostChange($event)" } }, usesInheritance: true, ngImport: i0 }); }
|
|
2792
2856
|
}
|
|
2793
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2857
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyAttributes, decorators: [{
|
|
2794
2858
|
type: Directive,
|
|
2795
2859
|
args: [{
|
|
2796
2860
|
selector: '[formlyAttributes]',
|
|
@@ -2848,10 +2912,10 @@ class FormlyValidationMessage {
|
|
|
2848
2912
|
}
|
|
2849
2913
|
return undefined;
|
|
2850
2914
|
}
|
|
2851
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2852
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2915
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyValidationMessage, deps: [{ token: FormlyConfig }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2916
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: FormlyValidationMessage, isStandalone: true, selector: "formly-validation-message", inputs: { field: "field" }, usesOnChanges: true, ngImport: i0, template: '{{ errorMessage$ | async }}', isInline: true, dependencies: [{ kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2853
2917
|
}
|
|
2854
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2918
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyValidationMessage, decorators: [{
|
|
2855
2919
|
type: Component,
|
|
2856
2920
|
args: [{
|
|
2857
2921
|
selector: 'formly-validation-message',
|
|
@@ -2864,10 +2928,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.33", ngImpo
|
|
|
2864
2928
|
type: Input
|
|
2865
2929
|
}] } });
|
|
2866
2930
|
class LegacyFormlyValidationMessage extends FormlyValidationMessage {
|
|
2867
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2868
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
2931
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyValidationMessage, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
2932
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.25", type: LegacyFormlyValidationMessage, isStandalone: false, selector: "formly-validation-message", usesInheritance: true, ngImport: i0, template: '{{ errorMessage$ | async }}', isInline: true, dependencies: [{ kind: "pipe", type: i2$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2869
2933
|
}
|
|
2870
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2934
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: LegacyFormlyValidationMessage, decorators: [{
|
|
2871
2935
|
type: Component,
|
|
2872
2936
|
args: [{
|
|
2873
2937
|
selector: 'formly-validation-message',
|
|
@@ -2948,10 +3012,10 @@ class FieldArrayType extends FieldType {
|
|
|
2948
3012
|
this.options._hiddenFieldsForCheck.push({ field: f });
|
|
2949
3013
|
}
|
|
2950
3014
|
}
|
|
2951
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2952
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
3015
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FieldArrayType, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3016
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: FieldArrayType, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
|
|
2953
3017
|
}
|
|
2954
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3018
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FieldArrayType, decorators: [{
|
|
2955
3019
|
type: Directive
|
|
2956
3020
|
}] });
|
|
2957
3021
|
|
|
@@ -2960,10 +3024,10 @@ class FieldWrapper extends FieldType {
|
|
|
2960
3024
|
set _staticContent(content) {
|
|
2961
3025
|
this.fieldComponent = content;
|
|
2962
3026
|
}
|
|
2963
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2964
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
3027
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FieldWrapper, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
3028
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.25", type: FieldWrapper, isStandalone: true, viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef }, { propertyName: "_staticContent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0 }); }
|
|
2965
3029
|
}
|
|
2966
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3030
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FieldWrapper, decorators: [{
|
|
2967
3031
|
type: Directive
|
|
2968
3032
|
}], propDecorators: { fieldComponent: [{
|
|
2969
3033
|
type: ViewChild,
|
|
@@ -3002,8 +3066,8 @@ class FormlyModule {
|
|
|
3002
3066
|
],
|
|
3003
3067
|
};
|
|
3004
3068
|
}
|
|
3005
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3006
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
3069
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
3070
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.25", ngImport: i0, type: FormlyModule, declarations: [LegacyFormlyTemplate,
|
|
3007
3071
|
LegacyFormlyForm,
|
|
3008
3072
|
LegacyFormlyField,
|
|
3009
3073
|
LegacyFormlyAttributes,
|
|
@@ -3015,9 +3079,9 @@ class FormlyModule {
|
|
|
3015
3079
|
LegacyFormlyAttributes,
|
|
3016
3080
|
LegacyFormlyValidationMessage,
|
|
3017
3081
|
FormlyGroup] }); }
|
|
3018
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
3082
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyModule, imports: [CommonModule] }); }
|
|
3019
3083
|
}
|
|
3020
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3084
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.25", ngImport: i0, type: FormlyModule, decorators: [{
|
|
3021
3085
|
type: NgModule,
|
|
3022
3086
|
args: [{
|
|
3023
3087
|
declarations: [
|