@esfaenza/forms-and-validations 11.2.4 → 11.2.5

package/bundles/esfaenza-forms-and-validations.umd.js

@@ -1748,6 +1748,25 @@
              * Associa il componente Form a questo input
              */
             this.Form = null;
+            /**
+             * Nome della proprietà che contiene l'Id degli oggetti bindati nella **Source**
+             */
+            this.IdField = 'id';
+            /**
+             * Espressione simil-Angular per cambiare il testo dei componenti che scelgono il proprio modello da una **Source**
+             *
+             * Il funzionamento è identico al binder di angular, solo con una graffa invece che 2.
+             * È inoltre possibile aggiungere pezzi di descrizione in maniera condizionale con la sintassi **:prop?(Prop vale {prop})**
+             */
+            this.Display = '{description}';
+            /**
+             * Risultato dell'unione fra le informazioni degli oggetti in **Source** e le impostazioni specificate nell'Input **Display**
+             */
+            this.BoundSource = [];
+            /**
+             * Indica se è il primo Bind del componente
+             */
+            this.FirstBind = true;
             /**
              * Evento chiamato alla modifica del valore collegato a questo campo
              */
@@ -1840,6 +1859,48 @@
             configurable: true
         });
         ;
+        /**
+         * Effettua il Bind/Parse delle varie **Source** unendo le informazioni specificate in **Display**
+         *
+         * Eventualmente rieffettua un bind al modello in base al valore della variabile **RebindModelAfterSource**
+         */
+        BaseFormControl.prototype.tryBindSourceDisplay = function () {
+            var _this = this;
+            if (!this.Source)
+                return;
+            if (this.Source.length == 0 && !this.FirstBind)
+                this.BoundSource = [];
+            this.FirstBind = false;
+            if (this.Source.length > 0) {
+                this.BoundSource = [];
+                var baseRegex = ":([a-z]+)\?\(([^\(\)]+)\)";
+                var conditions_1 = new RegExp(baseRegex, "g");
+                var conditionDetails_1 = new RegExp(baseRegex, "i");
+                var bindings_1 = /{[a-z]+}/gi;
+                this.Source.forEach(function (s) {
+                    var tmpDescription = _this.Display;
+                    var iffedMatches = tmpDescription.match(conditions_1);
+                    // Considerando di avere qualcosa del tipo --> :sqi?({sqi})
+                    if (iffedMatches) {
+                        for (var i = 0; i < iffedMatches.length; i++) {
+                            var m = iffedMatches[i];
+                            var groups = m.match(conditionDetails_1);
+                            // Se è presente la proprietà "sqi" nell'oggetto della source e non è falsy sostituisco con {sqi} per poterlo parsare al ciclo dopo
+                            // altrimenti elimino il blocco completamente
+                            tmpDescription = tmpDescription.replace(m[0], s[groups[1]] ? groups[2] : "");
+                        }
+                    }
+                    var matches = tmpDescription.match(bindings_1);
+                    if (matches) {
+                        for (var i = 0; i < matches.length; i++) {
+                            var m = matches[i];
+                            tmpDescription = tmpDescription.replace(m, s[m.substring(1, m.length - 1)]);
+                        }
+                    }
+                    _this.BoundSource.push({ id: s[_this.IdField], description: tmpDescription });
+                });
+            }
+        };
         /**
          * Indica se il comopnente in questione è in grado di gestire ngControl nulli.
          * Di default è **false**
@@ -2003,6 +2064,9 @@
         InputColWidth: [{ type: core.Input }],
         Last: [{ type: core.Input }],
         Form: [{ type: core.Input }],
+        Source: [{ type: core.Input }],
+        IdField: [{ type: core.Input }],
+        Display: [{ type: core.Input }],
         Readonly: [{ type: core.Input }],
         LabelInputRatio: [{ type: core.Input }],
         _validationControl: [{ type: core.ViewChild, args: ["validationControl", { static: false },] }],
@@ -2213,24 +2277,6 @@
             _this.utiExts = utiExts;
             _this.dateAdapter = dateAdapter;
             _this.lc = lc;
-            /**
-             * Nome della proprietà che contiene l'Id degli oggetti bindati nella Source
-             */
-            _this.IdField = 'id';
-            /**
-             * Espressione simil-Angular per cambiare il testo dei componenti che scelgono il proprio modello da una Source.
-             *
-             * Il funzionamento è identico al binder di angular, solo con una graffa invece che due
-             */
-            _this.Display = '{description}';
-            /**
-             * Risultato dell'unione fra le informazioni degli oggetti in **Source** e le impostazioni specificate nell'Input **Display**
-             */
-            _this.BoundSource = [];
-            /**
-             * Indica se è il primo Bind del componente
-             */
-            _this.FirstBind = true;
             /**
              * Permette di scaricare l'eventuale file presente qualora il **Type** di questo componente fosse **file**
              */
@@ -2263,27 +2309,6 @@
                 });
             });
         };
-        /**
-         * Effettua il Bind/Parse delle varie **Source** unendo le informazioni specificate in **Display**
-         */
-        FormAdaptiveComponent.prototype.tryBindSourceDisplay = function () {
-            var _this = this;
-            if (!this.Source)
-                return;
-            this.FirstBind = false;
-            if (this.Source.length > 0) {
-                this.BoundSource = [];
-                this.Source.forEach(function (s) {
-                    var matches = _this.Display.match(/{[a-z]+}/gi);
-                    var tmpDescription = _this.Display;
-                    matches.forEach(function (m) {
-                        tmpDescription = tmpDescription.replace(m, s[m.substring(1, m.length - 1)]);
-                    });
-                    s.finaldescription = tmpDescription;
-                    _this.BoundSource.push(s);
-                });
-            }
-        };
         /**
          * @ignore
          */
@@ -2368,7 +2393,7 @@
         { type: core.Component, args: [{
                     selector: "form-adaptive",
                     providers: [{ provide: localizations.LocalizationService, useClass: FormAdaptiveComponentLoc }],
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\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 [forceInvalid]=\"ForcedError\"\r\n        [CurrencyOptions]=\"{ prefix: '', thousands: '.', decimal: ',', precision: Precision, align: 'left' }\" [noValidate]=\"!Validation\"\r\n        #validationControl=\"ngModel\" type=\"text\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-currency>\r\n    </div>\r\n    <!--Se data-->\r\n    <div *ngIf=\"Type == 'date'\">\r\n        <val-date #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-date>\r\n    </div>\r\n    <!--Se stringa-->\r\n    <div *ngIf=\"Type == 'string'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || ''}}\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se numero-->\r\n    <div *ngIf=\"Type == 'float' || Type == 'number'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^([0-9]*[,])?[0-9]+$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se numero intero-->\r\n    <div *ngIf=\"Type == 'int'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^[0-9]\\\\d*$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></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\" name=\"{{GeneratedName}}\" (ngModelChange)=\"changed();\" />\r\n    </div>\r\n    <!--Se enum-->\r\n    <div *ngIf=\"Type == 'enum'\">\r\n        <val-select #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [placeHolderValue]=\"''\" [placeholder]=\"('Select' | localize : lc) + '...'\" [required]=\"Required\" [(ngModel)]=\"Model\" (inputChange)=\"changed();\" name=\"{{GeneratedName}}\">\r\n            <option *ngFor=\"let val of Source\" [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\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" [Source]=\"Source\" (inputChange)=\"changed();\"></val-autocomplete>\r\n    </div>\r\n    <!--Se date time-->\r\n    <div *ngIf=\"Type == 'datetime'\">\r\n        <val-datetime #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></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 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: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\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 [forceInvalid]=\"ForcedError\"\r\n        [CurrencyOptions]=\"{ prefix: '', thousands: '.', decimal: ',', precision: Precision, align: 'left' }\" [noValidate]=\"!Validation\"\r\n        #validationControl=\"ngModel\" type=\"text\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-currency>\r\n    </div>\r\n    <!--Se data-->\r\n    <div *ngIf=\"Type == 'date'\">\r\n        <val-date #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-date>\r\n    </div>\r\n    <!--Se stringa-->\r\n    <div *ngIf=\"Type == 'string'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || ''}}\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se numero-->\r\n    <div *ngIf=\"Type == 'float' || Type == 'number'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^([0-9]*[,])?[0-9]+$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></val-input>\r\n    </div>\r\n    <!--Se numero intero-->\r\n    <div *ngIf=\"Type == 'int'\">\r\n        <val-input #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" type=\"text\" pattern=\"{{Pattern || '^[0-9]\\\\d*$'}}\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></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\" name=\"{{GeneratedName}}\" (ngModelChange)=\"changed();\" />\r\n    </div>\r\n    <!--Se enum-->\r\n    <div *ngIf=\"Type == 'enum'\">\r\n        <val-select #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [placeHolderValue]=\"''\" [placeholder]=\"('Select' | localize : lc) + '...'\" [required]=\"Required\" [(ngModel)]=\"Model\" (inputChange)=\"changed();\" 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\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" [Source]=\"BoundSource\" (inputChange)=\"changed();\"></val-autocomplete>\r\n    </div>\r\n    <!--Se date time-->\r\n    <div *ngIf=\"Type == 'datetime'\">\r\n        <val-datetime #validationControl=\"ngModel\" [forceInvalid]=\"ForcedError\" [noValidate]=\"!Validation\" [readonly]=\"Readonly\" [submitted]=\"Form?.submitted\" [required]=\"Required\" [(ngModel)]=\"Model\" name=\"{{GeneratedName}}\" autocomplete=\"off\" (inputChange)=\"changed();\"></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 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: core.ChangeDetectionStrategy.OnPush,
                     styles: [".frm-padding-left-22{padding-left:22px}"]
                 },] }
@@ -2388,9 +2413,6 @@
         Type: [{ type: core.Input }],
         TypeMissingMessage: [{ type: core.Input }],
         Pattern: [{ type: core.Input }],
-        Source: [{ type: core.Input }],
-        IdField: [{ type: core.Input }],
-        Display: [{ type: core.Input }],
         inputEl: [{ type: core.ViewChild, args: ["fileInput", { static: false },] }],
         AllowDownload: [{ type: core.Input }],
         Precision: [{ type: core.Input }]
@@ -2801,24 +2823,6 @@
              * Si consiglia di mantenere il default
              */
             _this.EmptyFieldValue = '-2';
-            /**
-             * Nome della proprietà che contiene l'Id degli oggetti bindati nella Source
-             */
-            _this.IdField = 'id';
-            /**
-             * Espressione simil-Angular per cambiare il testo dei componenti che scelgono il proprio modello da una Source
-             *
-             * Il funzionamento è identico al binder di angular, solo con una graffa invece che 2
-             */
-            _this.Display = '{description}';
-            /**
-             * Risultato dell'unione fra le informazioni degli oggetti in **Source** e le impostazioni specificate nell'Input **Display**
-             */
-            _this.BoundSource = [];
-            /**
-             * Indica se è il primo Bind del componente
-             */
-            _this.FirstBind = true;
             return _this;
         }
         /**
@@ -2845,7 +2849,7 @@
                          */
                         if (!this.FirstBind && this.SelectLabel) {
                             this.BoundSource = null;
-                            setTimeout(function () { _this.tryBindSourceDisplay(true); });
+                            setTimeout(function () { _this.tryBindSourceDisplay(); _this.cdr.detectChanges(); });
                         }
                         else
                             this.tryBindSourceDisplay();
@@ -2855,37 +2859,6 @@
                 });
             });
         };
-        /**
-         * Effettua il Bind/Parse delle varie **Source** unendo le informazioni specificate in **Display**
-         *
-         * Eventualmente effettua un detectChanges qualora il componente fosse stato ricreato dalla funzione **ngOnChanges**
-         */
-        FormSelectComponent.prototype.tryBindSourceDisplay = function (detectChanges) {
-            if (detectChanges === void 0) { detectChanges = false; }
-            if (!this.Source)
-                return;
-            if (this.Source.length == 0 && !this.FirstBind)
-                this.BoundSource = [];
-            this.FirstBind = false;
-            if (this.Source.length > 0) {
-                this.BoundSource = [];
-                for (var i = 0; i < this.Source.length; i++) {
-                    var s = this.Source[i];
-                    var matches = this.Display.match(/{[a-z]+}/gi);
-                    var tmpDescription = this.Display;
-                    if (matches) {
-                        for (var mi = 0; mi < matches.length; mi++) {
-                            var m = matches[mi];
-                            tmpDescription = tmpDescription.replace(m, s[m.substring(1, m.length - 1)]);
-                        }
-                    }
-                    s.finaldescription = tmpDescription;
-                    this.BoundSource.push(s);
-                }
-            }
-            if (detectChanges)
-                this.cdr.detectChanges();
-        };
         /**
          * @ignore
          */
@@ -2896,7 +2869,7 @@
         { type: core.Component, args: [{
                     selector: "form-select",
                     providers: [{ provide: localizations.LocalizationService, useClass: FormSelectComponentLoc }],
-                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\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                [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 ? ('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                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\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                [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 ? ('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                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\r\n                #validationControl=\"ngModel\">\r\n        <option *ngFor=\"let obj of BoundSource\" [value]=\"obj[IdField]\">{{obj.finaldescription}}</option>\r\n    </val-select>\r\n</ng-template>",
+                    template: "<ng-container *ngIf=\"!FormLayout\">\r\n    <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && BoundSource\" class=\"form-group row {{FormGroupClass}}\" [class.app-margin-bottom-0]=\"Last\">\r\n    <label class=\"col-md-{{LabelColWidth}} m-t-5\">{{Label}}{{Required ? '*' : ''}}:</label>\r\n    <div class=\"col-md-{{InputColWidth}}\">\r\n        <ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"clearfix\"></div>\r\n</div>\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                [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 ? ('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                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\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                [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 ? ('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                name=\"{{GeneratedName}}\"\r\n                (inputChange)=\"Model = $event == EmptyFieldValue ? (Required? PlaceholderValue : '') : $event; changed();\"\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: core.ChangeDetectionStrategy.OnPush
                 },] }
     ];
@@ -2910,12 +2883,9 @@
         { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [ACO_CUSTOMKEY,] }] }
     ]; };
     FormSelectComponent.propDecorators = {
-        Source: [{ type: core.Input }],
         SelectLabel: [{ type: core.Input }],
         PlaceholderValue: [{ type: core.Input }],
-        EmptyFieldValue: [{ type: core.Input }],
-        IdField: [{ type: core.Input }],
-        Display: [{ type: core.Input }]
+        EmptyFieldValue: [{ type: core.Input }]
     };
 
     /**
@@ -2976,28 +2946,6 @@
              * Permette al componente di gestire come modello non una lista di chiavi, ma una lista di KeyValue
              */
             _this.UseKeyValues = false;
-            /**
-             * Nome della proprietà che contiene l'Id degli oggetti bindati nella Source
-             */
-            _this.IdField = 'id';
-            /**
-             * Indica il campo degli oggetti dentro all'array 'Source' dentro a cui c'è la descrizione
-             */
-            _this.DescriptionField = 'description';
-            /**
-             * Espressione simil-Angular per cambiare il testo dei componenti che scelgono il proprio modello da una Source
-             *
-             * Il funzionamento è identico al binder di angular, solo con una graffa invece che 2
-             */
-            _this.Display = '{description}';
-            /**
-             * Risultato dell'unione fra le informazioni degli oggetti in **Source** e le impostazioni specificate nell'Input **Display**
-             */
-            _this.BoundSource = [];
-            /**
-             * Indica se è il primo Bind del componente
-             */
-            _this.FirstBind = true;
             /**
              * Impostazioni del componente interno **angular2-multiselect**
              */
@@ -3013,8 +2961,13 @@
                 var newSource, readonly;
                 return __generator(this, function (_c) {
                     newSource = changes["Source"];
-                    if (newSource)
+                    if (newSource) {
                         this.tryBindSourceDisplay();
+                        if (this.RebindModelAfterSource) {
+                            this.writeValue(this.TmpModel);
+                            this.RebindModelAfterSource = false;
+                        }
+                    }
                     readonly = changes["Readonly"];
                     this.Settings = {
                         selectAllText: this.lc.loc("Select everything"),
@@ -3022,39 +2975,12 @@
                         text: this.SelectLabel || this.lc.loc("Select one or more values..."),
                         enableCheckAll: true,
                         disabled: readonly ? (_a = readonly.currentValue) !== null && _a !== void 0 ? _a : false : (_b = this.Readonly) !== null && _b !== void 0 ? _b : false,
+                        labelKey: "description"
                     };
                     return [2 /*return*/];
                 });
             });
         };
-        /**
-         * Effettua il Bind/Parse delle varie **Source** unendo le informazioni specificate in **Display**
-         *
-         * Eventualmente rieffettua un bind al modello in base al valore della variabile **RebindModelAfterSource**
-         */
-        FormMultiSelectComponent.prototype.tryBindSourceDisplay = function () {
-            var _this = this;
-            if (!this.Source)
-                return;
-            this.FirstBind = false;
-            if (this.Source.length > 0) {
-                this.BoundSource = [];
-                this.Source.forEach(function (s) {
-                    var matches = _this.Display.match(/{[a-z]+}/gi);
-                    var tmpDescription = _this.Display;
-                    if (matches) {
-                        matches.forEach(function (m) {
-                            tmpDescription = tmpDescription.replace(m, s[m.substring(1, m.length - 1)]);
-                        });
-                    }
-                    _this.BoundSource.push({ id: s[_this.IdField], itemName: tmpDescription });
-                });
-                if (this.RebindModelAfterSource) {
-                    this.writeValue(this.TmpModel);
-                    this.RebindModelAfterSource = false;
-                }
-            }
-        };
         /**
          * @ignore
          */
@@ -3121,12 +3047,8 @@
         { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [ACO_CUSTOMKEY,] }] }
     ]; };
     FormMultiSelectComponent.propDecorators = {
-        Source: [{ type: core.Input }],
         SelectLabel: [{ type: core.Input }],
-        UseKeyValues: [{ type: core.Input }],
-        IdField: [{ type: core.Input }],
-        DescriptionField: [{ type: core.Input }],
-        Display: [{ type: core.Input }]
+        UseKeyValues: [{ type: core.Input }]
     };
 
     /**
@@ -3178,26 +3100,7 @@
          * @ignore
          */
         function FormAutocompleteComponent(cdr, ngControl, _validators, ac, AppContext, ACO_CUSTOMKEY) {
-            var _this = _super.call(this, cdr, ngControl, _validators, ac, AppContext, ACO_CUSTOMKEY) || this;
-            /**
-             * Nome della proprietà che contiene l'Id degli oggetti bindati nella Source
-             */
-            _this.IdField = 'id';
-            /**
-             * Espressione simil-Angular per cambiare il testo dei componenti che scelgono il proprio modello da una Source
-             *
-             * Il funzionamento è identico al binder di angular, solo con una graffa invece che 2
-             */
-            _this.Display = '{description}';
-            /**
-             * Risultato dell'unione fra le informazioni degli oggetti in **Source** e le impostazioni specificate nell'Input **Display**
-             */
-            _this.BoundSource = [];
-            /**
-             * Indica se è il primo Bind del componente
-             */
-            _this.FirstBind = true;
-            return _this;
+            return _super.call(this, cdr, ngControl, _validators, ac, AppContext, ACO_CUSTOMKEY) || this;
         }
         /**
          * @ignore
@@ -3213,31 +3116,6 @@
                 });
             });
         };
-        /**
-         * Effettua il Bind/Parse delle varie **Source** unendo le informazioni specificate in **Display**
-         */
-        FormAutocompleteComponent.prototype.tryBindSourceDisplay = function () {
-            var _this = this;
-            if (!this.Source)
-                return;
-            if (this.Source.length == 0 && !this.FirstBind)
-                this.BoundSource = [];
-            this.FirstBind = false;
-            if (this.Source.length > 0) {
-                this.BoundSource = [];
-                this.Source.forEach(function (s) {
-                    var matches = _this.Display.match(/{[a-z]+}/gi);
-                    var tmpDescription = _this.Display;
-                    if (matches) {
-                        matches.forEach(function (m) {
-                            tmpDescription = tmpDescription.replace(m, s[m.substring(1, m.length - 1)]);
-                        });
-                    }
-                    s.finaldescription = tmpDescription;
-                    _this.BoundSource.push({ id: s[_this.IdField], description: s.finaldescription });
-                });
-            }
-        };
         /**
          * @ignore
          */
@@ -3258,12 +3136,7 @@
         { type: accessControl.AccessControlService, decorators: [{ type: core.Optional }] },
         { type: accessControl.ComponentContext, decorators: [{ type: core.Optional }] },
         { type: String, decorators: [{ type: core.Optional }, { type: core.Inject, args: [ACO_CUSTOMKEY,] }] }
-    ]; };
-    FormAutocompleteComponent.propDecorators = {
-        Source: [{ type: core.Input }],
-        IdField: [{ type: core.Input }],
-        Display: [{ type: core.Input }]
-    };
+    ]; };
 
     /**
      * Componente che identifica la selezione di un orario