@esfaenza/forms-and-validations 11.2.91 → 11.2.94

package/fesm2015/esfaenza-forms-and-validations.js

@@ -1906,10 +1906,13 @@ class BaseFormControl {
      *
      * Non posso tenerlo protected altrimenti posso eseguirlo solo dal .ts e non dall' .html
      */
-    changed(forcedValue = null, markForCheck = false) {
-        var _a, _b;
-        this.propagateChange(forcedValue == null || forcedValue == "" ? (_a = this.Model) !== null && _a !== void 0 ? _a : "" : forcedValue);
-        this.inputChange.emit(forcedValue == null || forcedValue == "" ? (_b = this.Model) !== null && _b !== void 0 ? _b : "" : forcedValue);
+    changed(forcedValue = null, markForCheck = false, modelEvaluationHandled = false) {
+        var _a;
+        let toEmit = forcedValue == null || forcedValue == "" ? (_a = this.Model) !== null && _a !== void 0 ? _a : "" : forcedValue;
+        if (!modelEvaluationHandled)
+            this.EvaluatedModel = toEmit;
+        this.propagateChange(toEmit);
+        this.inputChange.emit(toEmit);
         if (markForCheck)
             this.cdr.markForCheck();
     }
@@ -2054,7 +2057,8 @@ class FormFileComponent extends BaseFormControl {
             model.nativefiles = files;
             model.fileb64 = null;
         }
-        this.changed(null, true);
+        this.EvaluatedModel = model.filename;
+        this.changed(null, true, true);
     }
     /** Permette di scaricare l'eventuale file selezionato */
     downloadAttachment() {
@@ -2068,7 +2072,7 @@ FormFileComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-file",
                 providers: [{ provide: LocalizationService, useClass: FormFileComponentLoc }],
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <div class=\"input-group file-upload\">\r\n        <input type=\"file\" (change)=\"fileChange()\" id=\"{{GeneratedName}}\" #fileInput class=\"file-upload-btn app-pointer\" [multiple]=\"Multiple ? true : null\" />\r\n        <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && Model.filename && Model.fileb64\" class=\"form-control checking-field\" placeholder=\"{{'Select a file' | localize : lc}}...\" [(ngModel)]=\"Model.filename\" name=\"dsfile\" #validationControl=\"ngModel\" [required]=\"Required ? true : null\" />\r\n\r\n        <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && Model.filename && Model.fileb64\" (click)=\"downloadAttachment()\"></a>\r\n        <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"Model.filename\"></i>\r\n        <span class=\"input-group-btn\">\r\n            <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n        </span>\r\n    </div>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <div class=\"input-group file-upload\">\r\n        <input type=\"file\" (change)=\"fileChange()\" id=\"{{GeneratedName}}\" #fileInput class=\"file-upload-btn app-pointer\" [multiple]=\"Multiple ? true : null\" />\r\n        <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && Model.filename && Model.fileb64\" class=\"form-control checking-field\" placeholder=\"{{'Select a file' | localize : lc}}...\" [(ngModel)]=\"Model.filename\" name=\"dsfile\" #validationControl=\"ngModel\" [required]=\"Required ? true : null\" />\r\n\r\n        <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && Model.filename && Model.fileb64\" (click)=\"downloadAttachment()\"></a>\r\n        <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"Model.filename\"></i>\r\n        <span class=\"input-group-btn\">\r\n            <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n        </span>\r\n    </div>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [".frm-padding-left-22{padding-left:22px}"]
             },] }
@@ -2107,13 +2111,17 @@ class FormDateTimeComponent extends BaseFormControl {
         this.EvaluatedModel = this.datesExts.getFormatted(obj, false, true);
         super.writeValue(obj);
     }
+    changed() {
+        this.EvaluatedModel = this.Model ? this.datesExts.getFormatted(this.Model, false, true) : '';
+        super.changed(null, false, true);
+    }
     /** @ignore */
     onNotNullValueSet() { }
 }
 FormDateTimeComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-datetime",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-datetime  [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n                   [submitted]=\"Form?.submitted\"\r\n                   [forceInvalid]=\"ForcedError\"\r\n                   [readonly]=\"Readonly\"\r\n                   [id]=\"GeneratedName\"\r\n                   [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n                   [useJsDates]=\"JsDates\"\r\n                   [(ngModel)]=\"Model\"\r\n                   name=\"{{GeneratedName}}\"\r\n                   #validationControl=\"ngModel\"\r\n                   (inputChange)=\"changed();\"\r\n                   (inputFocus)=\"focused($event);\"\r\n                   (inputFinalized)=\"finalized()\"\r\n                   [placeholder]=\"Placeholder\"\r\n                   [validationFailed]=\"FailedValidationMessage\">\r\n    </val-datetime>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-datetime  [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n                   [submitted]=\"Form?.submitted\"\r\n                   [forceInvalid]=\"ForcedError\"\r\n                   [readonly]=\"Readonly\"\r\n                   [id]=\"GeneratedName\"\r\n                   [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n                   [useJsDates]=\"JsDates\"\r\n                   [(ngModel)]=\"Model\"\r\n                   name=\"{{GeneratedName}}\"\r\n                   #validationControl=\"ngModel\"\r\n                   (inputChange)=\"changed();\"\r\n                   (inputFocus)=\"focused($event);\"\r\n                   (inputFinalized)=\"finalized()\"\r\n                   [placeholder]=\"Placeholder\"\r\n                   [validationFailed]=\"FailedValidationMessage\">\r\n    </val-datetime>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];
@@ -2346,14 +2354,23 @@ class FormAdaptiveComponent extends BaseFormControl {
                 this.dateAdapter.clone(this.datesExts.getDateConvertion(this.Model))
                 : JSON.parse(JSON.stringify(this.Model)))
             : null;
-        if ((this.Type == "float" || this.Type == "number") && toEmit)
+        if ((this.Type == "float" || this.Type == "number") && toEmit) {
             toEmit = toEmit.replace(".", "").replace(",", ".");
-        else if (this.Type == "boolean")
+            this.EvaluatedModel = toEmit;
+        }
+        else if (this.Type == "boolean") {
             toEmit = toEmit ? true : false;
-        else if (this.Type == "time")
+            this.EvaluatedModel = this.lc.loc(toEmit ? 'Yes' : 'No');
+            ;
+        }
+        else if (this.Type == "time") {
             toEmit = toEmit.format("HH:mm:ss");
-        else if ((this.Type == "date" || this.Type == "datetime") && this.useJsDates)
+            this.EvaluatedModel = toEmit;
+        }
+        else if ((this.Type == "date" || this.Type == "datetime") && this.useJsDates) {
             toEmit = toEmit.toDate();
+            this.EvaluatedModel = this.datesExts.getFormatted(this.Model, this.Type == "date", this.Type == "datetime");
+        }
         return toEmit;
     }
     /**
@@ -2401,7 +2418,7 @@ FormAdaptiveComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-adaptive",
                 providers: [{ provide: LocalizationService, useClass: FormAdaptiveComponentLoc }],
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <div *ngIf=\"!Type\" class=\"app-margin-top-5\">\r\n        <em>{{TypeMissingMessage}}</em>\r\n    </div>\r\n   \r\n     <!--Se currency-->\r\n     <div *ngIf=\"Type == 'currency'\">\r\n        <val-currency #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\"\r\n        [CurrencyOptions]=\"{ prefix: '', thousands: '.', decimal: ',', precision: Precision, align: Alignment }\" [noValidate]=\"!Validation\"\r\n        type=\"text\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-currency>\r\n    </div>\r\n    <!--Se data-->\r\n    <div *ngIf=\"Type == 'date'\">\r\n        <val-date #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" [useJsDates]=\"useJsDates\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-date>\r\n    </div>\r\n    <!--Se stringa-->\r\n    <div *ngIf=\"Type == 'string'\">\r\n        <val-input #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || ''}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se numero-->\r\n    <div *ngIf=\"Type == 'float' || Type == 'number'\">\r\n        <val-input #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^([0-9]*[,])?[0-9]+$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se numero intero-->\r\n    <div *ngIf=\"Type == 'int'\">\r\n        <val-input #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^[0-9]\\\\d*$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se boolean-->\r\n    <div class=\"m-t-5\" *ngIf=\"Type == 'boolean'\">\r\n        <input #validationControl=\"ngModel\" [readonly]=\"Readonly\" type=\"checkbox\" class=\"app-pointer\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" (ngModelChange)=\"changed(); finalized();\" (click)=\"focused($event);\" />\r\n    </div>\r\n    <!--Se enum-->\r\n    <div *ngIf=\"Type == 'enum'\">\r\n        <val-select #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [placeHolderValue]=\"''\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [required]=\"Required\" [(ngModel)]=\"Model\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\">\r\n            <option *ngFor=\"let val of BoundSource\" [value]=\"val.id\">{{val.description}}</option>\r\n        </val-select>\r\n    </div>\r\n    <!--Se autocomplete-->\r\n    <div *ngIf=\"Type == 'autocomplete'\">\r\n        <val-autocomplete #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" [FilteredSource]=\"FilteredBoundSource\" (inputChange)=\"filterSource($event); changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-autocomplete>\r\n    </div>\r\n    <!--Se date time-->\r\n    <div *ngIf=\"Type == 'datetime'\">\r\n        <val-datetime #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [useJsDates]=\"useJsDates\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-datetime>\r\n    </div>\r\n    <!--Se time-->\r\n    <div *ngIf=\"Type == 'time'\">\r\n        <ngx-mat-timepicker name=\"val-time\" #elementRef #baseInput=\"ngModel\" [(ngModel)]=\"Model\" [disabled]=\"Readonly\"\r\n        [showSpinners]=\"false\" [stepHour]=\"2\" [stepMinute]=\"5\" [stepSecond]=\"30\"\r\n        [showSeconds]=\"true\" (ngModelChange)=\"changed()\" #validationControl=\"ngModel\">\r\n        </ngx-mat-timepicker>\r\n    </div>\r\n    <!--Se file-->\r\n    <div *ngIf=\"Type == 'file'\">\r\n        <div class=\"input-group file-upload\">\r\n            <input type=\"file\" (change)=\"fileChange()\" #fileInput id=\"{{GeneratedName}}\" class=\"file-upload-btn app-pointer\" [multiple]=\"null\"/>\r\n            <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" class=\"form-control checking-field\" placeholder=\"{{'Select a file' | localize : lc}}...\" [(ngModel)]=\"ModelFile.filename\" name=\"dsfile\" #validationControl=\"ngModel\" [required]=\"Required\"/>\r\n    \r\n            <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" (click)=\"downloadAttachment()\"></a>\r\n            <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"ModelFile.filename\"></i>\r\n            <span class=\"input-group-btn\">\r\n                <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n            </span>\r\n        </div>\r\n    </div>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <div *ngIf=\"!Type\" class=\"app-margin-top-5\">\r\n        <em>{{TypeMissingMessage}}</em>\r\n    </div>\r\n   \r\n     <!--Se currency-->\r\n     <div *ngIf=\"Type == 'currency'\">\r\n        <val-currency #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\"\r\n        [CurrencyOptions]=\"{ prefix: '', thousands: '.', decimal: ',', precision: Precision, align: Alignment }\" [noValidate]=\"!Validation\"\r\n        type=\"text\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-currency>\r\n    </div>\r\n    <!--Se data-->\r\n    <div *ngIf=\"Type == 'date'\">\r\n        <val-date #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" [useJsDates]=\"useJsDates\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-date>\r\n    </div>\r\n    <!--Se stringa-->\r\n    <div *ngIf=\"Type == 'string'\">\r\n        <val-input #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || ''}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se numero-->\r\n    <div *ngIf=\"Type == 'float' || Type == 'number'\">\r\n        <val-input #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^([0-9]*[,])?[0-9]+$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se numero intero-->\r\n    <div *ngIf=\"Type == 'int'\">\r\n        <val-input #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^[0-9]\\\\d*$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-input>\r\n    </div>\r\n    <!--Se boolean-->\r\n    <div class=\"m-t-5\" *ngIf=\"Type == 'boolean'\">\r\n        <input #validationControl=\"ngModel\" [readonly]=\"Readonly\" type=\"checkbox\" class=\"app-pointer\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" (ngModelChange)=\"changed(); finalized();\" (click)=\"focused($event);\" />\r\n    </div>\r\n    <!--Se enum-->\r\n    <div *ngIf=\"Type == 'enum'\">\r\n        <val-select #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [placeHolderValue]=\"''\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [required]=\"Required\" [(ngModel)]=\"Model\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\">\r\n            <option *ngFor=\"let val of BoundSource\" [value]=\"val.id\">{{val.description}}</option>\r\n        </val-select>\r\n    </div>\r\n    <!--Se autocomplete-->\r\n    <div *ngIf=\"Type == 'autocomplete'\">\r\n        <val-autocomplete #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [placeholder]=\"Required ? ('Select' | localize : lc) + '...' : Placeholder\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" [FilteredSource]=\"FilteredBoundSource\" (inputChange)=\"filterSource($event); changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-autocomplete>\r\n    </div>\r\n    <!--Se date time-->\r\n    <div *ngIf=\"Type == 'datetime'\">\r\n        <val-datetime #validationControl=\"ngModel\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [useJsDates]=\"useJsDates\" [(ngModel)]=\"Model\" [id]=\"GeneratedName\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\" (inputFocus)=\"focused($event);\" (inputFinalized)=\"finalized()\"></val-datetime>\r\n    </div>\r\n    <!--Se time-->\r\n    <div *ngIf=\"Type == 'time'\">\r\n        <ngx-mat-timepicker name=\"val-time\" #elementRef #baseInput=\"ngModel\" [(ngModel)]=\"Model\" [disabled]=\"Readonly\"\r\n        [showSpinners]=\"false\" [stepHour]=\"2\" [stepMinute]=\"5\" [stepSecond]=\"30\"\r\n        [showSeconds]=\"true\" (ngModelChange)=\"changed()\" #validationControl=\"ngModel\">\r\n        </ngx-mat-timepicker>\r\n    </div>\r\n    <!--Se file-->\r\n    <div *ngIf=\"Type == 'file'\">\r\n        <div class=\"input-group file-upload\">\r\n            <input type=\"file\" (change)=\"fileChange()\" #fileInput id=\"{{GeneratedName}}\" class=\"file-upload-btn app-pointer\" [multiple]=\"null\"/>\r\n            <input type=\"text\" [class.frm-padding-left-22]=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" class=\"form-control checking-field\" placeholder=\"{{'Select a file' | localize : lc}}...\" [(ngModel)]=\"ModelFile.filename\" name=\"dsfile\" #validationControl=\"ngModel\" [required]=\"Required\"/>\r\n    \r\n            <a class=\"fa fa-download app-pointer app-input-icon\" *ngIf=\"AllowDownload && ModelFile.filename && ModelFile.fileb64\" (click)=\"downloadAttachment()\"></a>\r\n            <i class=\"fa fa-times delete-file\" (click)=\"fileChange(true)\" *ngIf=\"ModelFile.filename\"></i>\r\n            <span class=\"input-group-btn\">\r\n                <button class=\"btn btn-primary btn-file-upload\" type=\"button\"><i class=\"fa fa-upload\"></i></button>\r\n            </span>\r\n        </div>\r\n    </div>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
                 styles: [".frm-padding-left-22{padding-left:22px}"]
             },] }
@@ -2599,13 +2616,17 @@ class FormCheckboxComponent extends BaseFormControl {
         this.EvaluatedModel = this.lc.loc(obj ? 'Yes' : 'No');
         super.writeValue(obj);
     }
+    changed() {
+        this.EvaluatedModel = this.lc.loc(this.Model ? 'Yes' : 'No');
+        super.changed(null, false, true);
+    }
     /** @ignore */
     onNotNullValueSet() { }
 }
 FormCheckboxComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-checkbox",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <input class=\"app-pointer\" [disabled]=\"Readonly ? true : null\" type=\"checkbox\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" #validationControl=\"ngModel\" (ngModelChange)=\"changed(); finalized()\" (click)=\"focused($event)\" />\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <input class=\"app-pointer\" [disabled]=\"Readonly ? true : null\" type=\"checkbox\" [(ngModel)]=\"Model\" id=\"{{GeneratedName}}\" name=\"{{GeneratedName}}\" #validationControl=\"ngModel\" (ngModelChange)=\"changed(); finalized()\" (click)=\"focused($event)\" />\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];
@@ -2634,13 +2655,17 @@ class FormDateComponent extends BaseFormControl {
         this.EvaluatedModel = this.datesExts.getFormatted(obj, true, false);
         super.writeValue(obj);
     }
+    changed() {
+        this.EvaluatedModel = this.Model ? this.datesExts.getFormatted(this.Model, true, false) : '';
+        super.changed(null, false, true);
+    }
     /** @ignore */
     onNotNullValueSet() { }
 }
 FormDateComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-date",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-date [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n              [submitted]=\"Form?.submitted\"\r\n              [forceInvalid]=\"ForcedError\"\r\n              [id]=\"GeneratedName\"\r\n              [readonly]=\"Readonly\"\r\n              [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n              [useJsDates]=\"JsDates\"\r\n              [(ngModel)]=\"Model\"\r\n              name=\"{{GeneratedName}}\"\r\n              #validationControl=\"ngModel\"\r\n              (inputChange)=\"changed();\"\r\n              (inputFocus)=\"focused($event);\"\r\n              (inputFinalized)=\"finalized()\"\r\n              [placeholder]=\"Placeholder\"\r\n              [validationFailed]=\"FailedValidationMessage\">\r\n    </val-date>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-date [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n              [submitted]=\"Form?.submitted\"\r\n              [forceInvalid]=\"ForcedError\"\r\n              [id]=\"GeneratedName\"\r\n              [readonly]=\"Readonly\"\r\n              [class]=\"Readonly ? 'app-bg-lightgrey' : ''\"\r\n              [useJsDates]=\"JsDates\"\r\n              [(ngModel)]=\"Model\"\r\n              name=\"{{GeneratedName}}\"\r\n              #validationControl=\"ngModel\"\r\n              (inputChange)=\"changed();\"\r\n              (inputFocus)=\"focused($event);\"\r\n              (inputFinalized)=\"finalized()\"\r\n              [placeholder]=\"Placeholder\"\r\n              [validationFailed]=\"FailedValidationMessage\">\r\n    </val-date>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];
@@ -2691,7 +2716,7 @@ class FormInputComponent extends BaseFormControl {
 FormInputComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-input",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-input [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n               [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [readonly]=\"Readonly\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               type=\"text\"\r\n               [(ngModel)]=\"Model\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               autocomplete=\"off\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"changed();\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               [placeholder]=\"Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [Password]=\"Password\">\r\n        <ng-container *ngIf=\"HasSuffix\">\r\n            <ng-template #suffix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-suffix\"\r\n                        matSuffix (click)=\"onSuffixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"HasPrefix\">\r\n            <ng-template #prefix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-prefix\"\r\n                        matPrefix (click)=\"onPrefixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n    </val-input>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-input [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n               [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [readonly]=\"Readonly\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               type=\"text\"\r\n               [(ngModel)]=\"Model\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               autocomplete=\"off\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"changed();\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               [placeholder]=\"Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [Password]=\"Password\">\r\n        <ng-container *ngIf=\"HasSuffix\">\r\n            <ng-template #suffix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-suffix\"\r\n                        matSuffix (click)=\"onSuffixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"HasPrefix\">\r\n            <ng-template #prefix_internal>\r\n                <button type=\"button\" class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-prefix\"\r\n                        matPrefix (click)=\"onPrefixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n                    <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\r\n                </button>\r\n            </ng-template>\r\n        </ng-container>\r\n    </val-input>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];
@@ -2829,6 +2854,11 @@ class FormSelectComponent extends BaseFormControl {
         this.EvaluatedModel = this.BoundSource && this.BoundSource.length > 0 ? (_a = this.BoundSource.find(t => t.id == this.Model)) === null || _a === void 0 ? void 0 : _a.description : "";
         super.writeValue(obj);
     }
+    changed() {
+        var _a;
+        this.EvaluatedModel = this.BoundSource && this.BoundSource.length > 0 ? (_a = this.BoundSource.find(t => t.id == this.Model)) === null || _a === void 0 ? void 0 : _a.description : "";
+        super.changed(null, false, true);
+    }
     /** @ignore */
     onNotNullValueSet() { }
 }
@@ -2836,7 +2866,7 @@ FormSelectComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-select",
                 providers: [{ provide: LocalizationService, useClass: FormSelectComponentLoc }],
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n\r\n    <!-- Select vuota per quando non ho Sorgenti dati da cui selezionare. Uguale identica alla piena ma senza option\r\n    Purtroppo devono essere due componenti distinti perch\u00E9 una select una volta creata non riesce pi\u00F9 ad adattarsi ai cambi di options -->\r\n    <val-select *ngIf=\"!BoundSource || BoundSource.length == 0\"\r\n                [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...'))  : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}_zero\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                (inputFocus)=\"focused($event);\"\r\n                #validationControl=\"ngModel\">\r\n    </val-select>\r\n\r\n    <!-- Select vera e propria per quando arrivano i dati -->\r\n    <val-select *ngIf=\"BoundSource && BoundSource.length > 0\"\r\n                [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}_filled\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                (inputFocus)=\"focused($event);\"\r\n                (inputFinalized)=\"finalized()\"\r\n                #validationControl=\"ngModel\">\r\n        <option *ngFor=\"let obj of BoundSource\" [value]=\"obj.id\">{{obj.description}}</option>\r\n    </val-select>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n\r\n    <!-- Select vuota per quando non ho Sorgenti dati da cui selezionare. Uguale identica alla piena ma senza option\r\n    Purtroppo devono essere due componenti distinti perch\u00E9 una select una volta creata non riesce pi\u00F9 ad adattarsi ai cambi di options -->\r\n    <val-select *ngIf=\"!BoundSource || BoundSource.length == 0\"\r\n                [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...'))  : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}_zero\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                (inputFocus)=\"focused($event);\"\r\n                #validationControl=\"ngModel\">\r\n    </val-select>\r\n\r\n    <!-- Select vera e propria per quando arrivano i dati -->\r\n    <val-select *ngIf=\"BoundSource && BoundSource.length > 0\"\r\n                [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n                [required]=\"Required ? 'required' : null\"\r\n                [noValidate]=\"!Validation\"\r\n                [readonly]=\"Readonly\"\r\n                [forceInvalid]=\"ForcedError\"\r\n                [label]=\"SelectLabel\"\r\n                [validationFailed]=\"FailedValidationMessage\"\r\n                [showValidationSymbol]=\"ShowValidationSymbol\"\r\n                [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n                [placeHolderValue]=\"PlaceholderValue\"\r\n                [submitted]=\"Form?.submitted\"\r\n                [emptyFieldValue]=\"Required || Placeholder || SelectLabel ? EmptyFieldValue : ''\"\r\n                [(ngModel)]=\"Model\"\r\n                [id]=\"GeneratedName\"\r\n                name=\"{{GeneratedName}}_filled\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                (inputFocus)=\"focused($event);\"\r\n                (inputFinalized)=\"finalized()\"\r\n                #validationControl=\"ngModel\">\r\n        <option *ngFor=\"let obj of BoundSource\" [value]=\"obj.id\">{{obj.description}}</option>\r\n    </val-select>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];
@@ -2981,7 +3011,8 @@ class FormMultiSelectComponent extends BaseFormControl {
             toEmit = this.Model.map(m => ({ id: m.id, description: m.itemName }));
         else if (this.UseCommaSeparatedList)
             toEmit = this.Model.map(m => m.id).join(',');
-        super.changed(toEmit);
+        this.EvaluatedModel = this.Model.map(t => t.itemName).join(', ');
+        super.changed(toEmit, false, true);
         super.finalized();
     }
 }
@@ -2989,7 +3020,7 @@ FormMultiSelectComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-multiselect",
                 viewProviders: [{ provide: LocalizationService, useClass: FormMultiSelectComponentLoc }],
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <div [class.ms-placeholder]=\"!Model || Model.length == 0\" (click)=\"focused($event)\">\r\n        <angular2-multiselect #validationControl=\"ngModel\" type=\"text\"\r\n            [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\"\r\n            [settings]=\"Settings\" [data]=\"BoundSource\"\r\n            (onSelect)=\"changed();\" \r\n            (onDeSelect)=\"changed();\" \r\n            (onSelectAll)=\"changed();\"\r\n            (onDeSelectAll)=\"changed();\" \r\n            (onDeSelectAll)=\"Model = []; changed();\">\r\n        </angular2-multiselect>\r\n    </div>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <div [class.ms-placeholder]=\"!Model || Model.length == 0\" (click)=\"focused($event)\">\r\n        <angular2-multiselect #validationControl=\"ngModel\" type=\"text\"\r\n            [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\"\r\n            [settings]=\"Settings\" [data]=\"BoundSource\"\r\n            (onSelect)=\"changed();\" \r\n            (onDeSelect)=\"changed();\" \r\n            (onSelectAll)=\"changed();\"\r\n            (onDeSelectAll)=\"changed();\" \r\n            (onDeSelectAll)=\"Model = []; changed();\">\r\n        </angular2-multiselect>\r\n    </div>\r\n</ng-template>",
                 encapsulation: ViewEncapsulation.None,
                 changeDetection: ChangeDetectionStrategy.Default,
                 styles: [".c-btn{background:#fff;border:1px solid #ccc;color:#333}.selected-list .c-list .c-token{background:#415269}.selected-list .c-list .c-token .c-label{color:#fff}.selected-list .c-list .c-token .c-remove svg{fill:#fff}.selected-list .c-angle-down svg,.selected-list .c-angle-up svg{fill:#333}.dropdown-list ul li:hover{background:#f5f5f5}.arrow-down,.arrow-up{border-bottom:15px solid #fff}.arrow-2{border-bottom:15px solid #ccc}.list-area{border:1px solid #ccc;background:#fff;box-shadow:0 1px 5px #959595}.list-filter,.select-all{border-bottom:1px solid #ccc}.list-filter .c-clear svg,.list-filter .c-search svg{fill:#888}.pure-checkbox input[type=checkbox]:focus+label:before,.pure-checkbox input[type=checkbox]:hover+label:before{border-color:#415269;background-color:#f2f2f2}.pure-checkbox input[type=checkbox]+label{color:#000}.pure-checkbox input[type=checkbox]+label:before{color:#415269;border:1px solid #415269}.pure-checkbox input[type=checkbox]+label:after{background-color:#415269}.pure-checkbox input[type=checkbox]:disabled+label:before{border-color:#ccc}.pure-checkbox input[type=checkbox]:disabled:checked+label:before{background-color:#ccc}.pure-checkbox input[type=checkbox]+label:after{border-color:#fff}.pure-checkbox input[type=radio]:checked+label:before{background-color:#fff}.pure-checkbox input[type=checkbox]:checked+label:before{background:#415269}.single-select-mode .pure-checkbox input[type=checkbox]:focus+label:before,.single-select-mode .pure-checkbox input[type=checkbox]:hover+label:before{border-color:#415269;background-color:#f2f2f2}.single-select-mode .pure-checkbox input[type=checkbox]+label{color:#000}.single-select-mode .pure-checkbox input[type=checkbox]+label:before{color:transparent!important;border:0 solid #415269}.single-select-mode .pure-checkbox input[type=checkbox]+label:after{background-color:transparent!important}.single-select-mode .pure-checkbox input[type=checkbox]:disabled+label:before{border-color:#ccc}.single-select-mode .pure-checkbox input[type=checkbox]:disabled:checked+label:before{background-color:#ccc}.single-select-mode .pure-checkbox input[type=checkbox]+label:after{border-color:#415269}.single-select-mode .pure-checkbox input[type=radio]:checked+label:before{background-color:#fff}.single-select-mode .pure-checkbox input[type=checkbox]:checked+label:before{background:none!important}.selected-item{background:#e9f4ff}.btn-iceblue{background:#415269;border:1px solid #ccc;color:#fff}.cuppa-dropdown{margin-top:2px;min-width:200px}.cuppa-dropdown .c-btn{min-height:34px}.cuppa-dropdown .c-angle-down,.cuppa-dropdown .c-angle-up{margin-top:-2px}.selected-list .c-list{width:auto!important;padding-right:35px!important;margin-top:-2px!important}.selected-list .c-list .c-token{padding:3px 22px 3px 8px!important}.ms-placeholder .cuppa-dropdown .selected-list>div>span{color:#aaa}"]
@@ -3029,7 +3060,7 @@ class FormTextareaComponent extends BaseFormControl {
 FormTextareaComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-textarea",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-textarea \r\n        [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n        [noValidate]=\"!Validation\" \r\n        [submitted]=\"Form?.submitted\" \r\n        [forceInvalid]=\"ForcedError\"\r\n        [id]=\"GeneratedName\" \r\n        [rows]=\"Rows\" \r\n        [readonly]=\"Readonly\"\r\n        [class]=\"Readonly ? 'app-bg-lightgrey app-no-resize' : 'app-no-resize'\" \r\n        [(ngModel)]=\"Model\"\r\n        name=\"{{GeneratedName}}\" \r\n        autocomplete=\"off\" \r\n        [placeholder]=\"Placeholder\"\r\n        [validationFailed]=\"FailedValidationMessage\" \r\n        #validationControl=\"ngModel\" \r\n        (inputChange)=\"changed();\"\r\n        (inputFocus)=\"focused($event);\"\r\n        (inputFinalized)=\"finalized()\"\r\n        >\r\n    </val-textarea>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-textarea \r\n        [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\"\r\n        [noValidate]=\"!Validation\" \r\n        [submitted]=\"Form?.submitted\" \r\n        [forceInvalid]=\"ForcedError\"\r\n        [id]=\"GeneratedName\" \r\n        [rows]=\"Rows\" \r\n        [readonly]=\"Readonly\"\r\n        [class]=\"Readonly ? 'app-bg-lightgrey app-no-resize' : 'app-no-resize'\" \r\n        [(ngModel)]=\"Model\"\r\n        name=\"{{GeneratedName}}\" \r\n        autocomplete=\"off\" \r\n        [placeholder]=\"Placeholder\"\r\n        [validationFailed]=\"FailedValidationMessage\" \r\n        #validationControl=\"ngModel\" \r\n        (inputChange)=\"changed();\"\r\n        (inputFocus)=\"focused($event);\"\r\n        (inputFinalized)=\"finalized()\"\r\n        >\r\n    </val-textarea>\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];
@@ -3118,7 +3149,7 @@ class FormAutocompleteComponent extends BaseFormControl {
      * @param {any} value Valore scritto nell'input di testo
      */
     finalizeValue(value) {
-        var val = this.Source.find(t => t.id == value);
+        var val = this.BoundSource.find(t => t.id == value);
         this.propagateChange(val ? val.id : value);
         this.Model = val ? val.description : value;
         this.EvaluatedModel = this.Model;
@@ -3213,6 +3244,8 @@ class FormAutocompleteComponent extends BaseFormControl {
             this.ignoreNextWriteValue = true;
         if (forcedValue == "" && this.Multi)
             this.Model = "";
+        var selecteds = this.Model ? this.Model.split(',') : [];
+        this.EvaluatedModel = selecteds.map(t => { var _a; return this.BoundSource && this.BoundSource.length > 0 ? (_a = this.BoundSource.find(t => t.id == this.Model)) === null || _a === void 0 ? void 0 : _a.description : ""; }).join(', ');
         super.changed(forcedValue, markForCheck);
     }
     /** @ignore */
@@ -3229,7 +3262,7 @@ class FormAutocompleteComponent extends BaseFormControl {
 FormAutocompleteComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-autocomplete",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-autocomplete *ngIf=\"!Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               [readonly]=\"Readonly\"\r\n               [label]=\"SelectLabel\"\r\n               type=\"text\"\r\n               [ngModel]=\"Model\"\r\n               (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"filterSource($event);\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               (optionChange)=\"changed($event);\"\r\n               [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [FilteredSource]=\"FilteredBoundSource\">\r\n    </val-autocomplete>\r\n\r\n    <val-autocomplete-multi *ngIf=\"Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               [readonly]=\"Readonly\"\r\n               [label]=\"SelectLabel\"\r\n               [ChipThreshold]=\"MultiElementsThreshold\"\r\n               type=\"text\"\r\n               [ngModel]=\"Model\"\r\n               (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"filterSource($event);\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               (optionChange)=\"changed($event);\"\r\n               [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [FilteredSource]=\"FilteredBoundSource\">\r\n\r\n    </val-autocomplete-multi>\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <val-autocomplete *ngIf=\"!Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               [readonly]=\"Readonly\"\r\n               [label]=\"SelectLabel\"\r\n               type=\"text\"\r\n               [ngModel]=\"Model\"\r\n               (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"filterSource($event);\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               (optionChange)=\"changed($event);\"\r\n               [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [FilteredSource]=\"FilteredBoundSource\">\r\n    </val-autocomplete>\r\n\r\n    <val-autocomplete-multi *ngIf=\"Multi\" [FocusSubject]=\"FocusSubject\" [FieldAppearence]=\"FieldAppearence\" [noValidate]=\"!Validation\"\r\n               [submitted]=\"Form?.submitted\"\r\n               [forceInvalid]=\"ForcedError\"\r\n               [readonly]=\"Readonly\"\r\n               [label]=\"SelectLabel\"\r\n               [ChipThreshold]=\"MultiElementsThreshold\"\r\n               type=\"text\"\r\n               [ngModel]=\"Model\"\r\n               (ngModelChange)=\"Model = $event; evaluateIdResearch()\"\r\n               [id]=\"GeneratedName\"\r\n               name=\"{{GeneratedName}}\"\r\n               #validationControl=\"ngModel\"\r\n               (inputChange)=\"filterSource($event);\"\r\n               (inputFocus)=\"focused($event);\"\r\n               (inputFinalized)=\"finalized()\"\r\n               (optionChange)=\"changed($event);\"\r\n               [placeholder]=\"Required ? ((RequiredPlaceholder != null ? RequiredPlaceholder : ('Select' | localize : lc) + '...')) : Placeholder\"\r\n               [validationFailed]=\"FailedValidationMessage\"\r\n               [FilteredSource]=\"FilteredBoundSource\">\r\n\r\n    </val-autocomplete-multi>\r\n</ng-template>",
                 providers: [{ provide: LocalizationService, useClass: FormAutocompleteComponentLoc }],
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
@@ -3308,12 +3341,15 @@ class FormTimeComponent extends BaseFormControl {
         switch (this.InOutFormat) {
             case 'date':
                 toEmit = toEmit.toDate();
+                this.EvaluatedModel = toEmit.format('HH:mm:ss');
                 break;
             case 'timestring':
                 toEmit = toEmit.format("HH:mm" + (this.ShowSeconds ? ":ss" : ""));
+                this.EvaluatedModel = toEmit;
                 break;
             case 'dayjs':
                 toEmit = toEmit;
+                this.EvaluatedModel = toEmit.format('HH:mm:ss');
                 break;
         }
         super.changed(toEmit);
@@ -3324,7 +3360,7 @@ class FormTimeComponent extends BaseFormControl {
 FormTimeComponent.decorators = [
     { type: Component, args: [{
                 selector: "form-time",
-                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <ngx-mat-timepicker name=\"val-time\" #elementRef #baseInput=\"ngModel\" [(ngModel)]=\"Model\" [disabled]=\"Readonly\"\r\n        [showSpinners]=\"ShowSpinners\" [stepHour]=\"StepHour\" [stepMinute]=\"StepMinute\" [stepSecond]=\"StepSecond\"\r\n        [showSeconds]=\"ShowSeconds\" (ngModelChange)=\"changed()\" #validationControl=\"ngModel\">\r\n    </ngx-mat-timepicker>\r\n\r\n</ng-template>",
+                template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\">\r\n    <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n        <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n        <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n    <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || DisplayLayout != 'hidden')\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n\r\n    <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}:</label>\r\n    <span *ngIf=\"DisplayMode && DisplayLayout == 'inline'\">&nbsp;</span>\r\n    <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n\r\n        <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n        <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n        <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n    <ngx-mat-timepicker name=\"val-time\" #elementRef #baseInput=\"ngModel\" [(ngModel)]=\"Model\" [disabled]=\"Readonly\"\r\n        [showSpinners]=\"ShowSpinners\" [stepHour]=\"StepHour\" [stepMinute]=\"StepMinute\" [stepSecond]=\"StepSecond\"\r\n        [showSeconds]=\"ShowSeconds\" (ngModelChange)=\"changed()\" #validationControl=\"ngModel\">\r\n    </ngx-mat-timepicker>\r\n\r\n</ng-template>",
                 changeDetection: ChangeDetectionStrategy.OnPush
             },] }
 ];