ng-prime-tools
Version:
An advanced PrimeNG table for Angular
57 lines • 11.4 kB
JavaScript
import { Component, Input } from '@angular/core';
import { FormControl, Validators } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
import * as i3 from "primeng/dropdown";
export class PTDropdownComponent {
ngOnInit() {
this.setupControl();
}
setupControl() {
let control = this.formGroup.get(this.formField.name);
if (!control) {
control = new FormControl(this.formField.value || null);
this.formGroup.addControl(this.formField.name, control);
}
const validators = this.getValidators();
control.setValidators(validators);
// Manage the disabled state using form control
setTimeout(() => {
if (this.formField.disabled !== undefined) {
if (this.formField.disabled) {
control.disable({ emitEvent: false });
}
else {
control.enable({ emitEvent: false });
}
}
control.updateValueAndValidity({ emitEvent: false });
});
}
getValidators() {
const validators = [];
if (this.formField.required) {
validators.push(Validators.required);
}
return validators;
}
getErrorMessage() {
const control = this.formGroup.get(this.formField.name);
if (control?.hasError('required')) {
return this.formField.errorText || `${this.formField.label} is required`;
}
return '';
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: PTDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: PTDropdownComponent, selector: "pt-dropdown", inputs: { formGroup: "formGroup", formField: "formField" }, ngImport: i0, template: "<div\n [formGroup]=\"formGroup\"\n class=\"form-field\"\n [ngStyle]=\"{ width: formField.width || '100%' }\"\n *ngIf=\"!formField.hidden\"\n>\n <label *ngIf=\"formField.label\">{{ formField.label }}</label>\n <p-dropdown\n [formControlName]=\"formField.name\"\n [options]=\"formField.options\"\n [placeholder]=\"formField.placeholder || 'Select an option'\"\n optionLabel=\"label\"\n ></p-dropdown>\n <div\n *ngIf=\"\n formGroup.get(formField.name)?.invalid &&\n formGroup.get(formField.name)?.touched\n \"\n >\n <small class=\"p-error\">{{ getErrorMessage() }}</small>\n </div>\n</div>\n", styles: [".form-field{margin-bottom:1rem}.form-field label{display:block;margin-bottom:.5rem;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: PTDropdownComponent, decorators: [{
type: Component,
args: [{ selector: 'pt-dropdown', template: "<div\n [formGroup]=\"formGroup\"\n class=\"form-field\"\n [ngStyle]=\"{ width: formField.width || '100%' }\"\n *ngIf=\"!formField.hidden\"\n>\n <label *ngIf=\"formField.label\">{{ formField.label }}</label>\n <p-dropdown\n [formControlName]=\"formField.name\"\n [options]=\"formField.options\"\n [placeholder]=\"formField.placeholder || 'Select an option'\"\n optionLabel=\"label\"\n ></p-dropdown>\n <div\n *ngIf=\"\n formGroup.get(formField.name)?.invalid &&\n formGroup.get(formField.name)?.touched\n \"\n >\n <small class=\"p-error\">{{ getErrorMessage() }}</small>\n </div>\n</div>\n", styles: [".form-field{margin-bottom:1rem}.form-field label{display:block;margin-bottom:.5rem;font-weight:700}\n"] }]
}], propDecorators: { formGroup: [{
type: Input
}], formField: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHQtZHJvcGRvd24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctcHJpbWUtdG9vbHMvc3JjL2xpYi9wdC1kcm9wZG93bi9wdC1kcm9wZG93bi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1wcmltZS10b29scy9zcmMvbGliL3B0LWRyb3Bkb3duL3B0LWRyb3Bkb3duLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQ3pELE9BQU8sRUFBYSxXQUFXLEVBQUUsVUFBVSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7O0FBUXBFLE1BQU0sT0FBTyxtQkFBbUI7SUFJOUIsUUFBUTtRQUNOLElBQUksQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRUQsWUFBWTtRQUNWLElBQUksT0FBTyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFnQixDQUFDO1FBRXJFLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUNiLE9BQU8sR0FBRyxJQUFJLFdBQVcsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsQ0FBQztZQUN4RCxJQUFJLENBQUMsU0FBUyxDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksRUFBRSxPQUFPLENBQUMsQ0FBQztRQUMxRCxDQUFDO1FBRUQsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1FBQ3hDLE9BQU8sQ0FBQyxhQUFhLENBQUMsVUFBVSxDQUFDLENBQUM7UUFFbEMsK0NBQStDO1FBQy9DLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDZCxJQUFJLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxLQUFLLFNBQVMsRUFBRSxDQUFDO2dCQUMxQyxJQUFJLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxFQUFFLENBQUM7b0JBQzVCLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLENBQUMsQ0FBQztnQkFDeEMsQ0FBQztxQkFBTSxDQUFDO29CQUNOLE9BQU8sQ0FBQyxNQUFNLENBQUMsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLENBQUMsQ0FBQztnQkFDdkMsQ0FBQztZQUNILENBQUM7WUFFRCxPQUFPLENBQUMsc0JBQXNCLENBQUMsRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLENBQUMsQ0FBQztRQUN2RCxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7SUFFTyxhQUFhO1FBQ25CLE1BQU0sVUFBVSxHQUFHLEVBQUUsQ0FBQztRQUN0QixJQUFJLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxFQUFFLENBQUM7WUFDNUIsVUFBVSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsUUFBUSxDQUFDLENBQUM7UUFDdkMsQ0FBQztRQUNELE9BQU8sVUFBVSxDQUFDO0lBQ3BCLENBQUM7SUFFRCxlQUFlO1FBQ2IsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyxHQUFHLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUN4RCxJQUFJLE9BQU8sRUFBRSxRQUFRLENBQUMsVUFBVSxDQUFDLEVBQUUsQ0FBQztZQUNsQyxPQUFPLElBQUksQ0FBQyxTQUFTLENBQUMsU0FBUyxJQUFJLEdBQUcsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLGNBQWMsQ0FBQztRQUMzRSxDQUFDO1FBQ0QsT0FBTyxFQUFFLENBQUM7SUFDWixDQUFDOytHQS9DVSxtQkFBbUI7bUdBQW5CLG1CQUFtQiwrR0NUaEMsdW5CQXNCQTs7NEZEYmEsbUJBQW1CO2tCQUwvQixTQUFTOytCQUNFLGFBQWE7OEJBS2QsU0FBUztzQkFBakIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtR3JvdXAsIEZvcm1Db250cm9sLCBWYWxpZGF0b3JzIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgRm9ybURyb3Bkb3duRmllbGQgfSBmcm9tICcuLi9tb2RlbHMvZm9ybS1kcm9wLWRvd24tZmllbGQubW9kZWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdwdC1kcm9wZG93bicsXG4gIHRlbXBsYXRlVXJsOiAnLi9wdC1kcm9wZG93bi5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3B0LWRyb3Bkb3duLmNvbXBvbmVudC5jc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgUFREcm9wZG93bkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIGZvcm1Hcm91cCE6IEZvcm1Hcm91cDtcbiAgQElucHV0KCkgZm9ybUZpZWxkITogRm9ybURyb3Bkb3duRmllbGQ7XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy5zZXR1cENvbnRyb2woKTtcbiAgfVxuXG4gIHNldHVwQ29udHJvbCgpIHtcbiAgICBsZXQgY29udHJvbCA9IHRoaXMuZm9ybUdyb3VwLmdldCh0aGlzLmZvcm1GaWVsZC5uYW1lKSBhcyBGb3JtQ29udHJvbDtcblxuICAgIGlmICghY29udHJvbCkge1xuICAgICAgY29udHJvbCA9IG5ldyBGb3JtQ29udHJvbCh0aGlzLmZvcm1GaWVsZC52YWx1ZSB8fCBudWxsKTtcbiAgICAgIHRoaXMuZm9ybUdyb3VwLmFkZENvbnRyb2wodGhpcy5mb3JtRmllbGQubmFtZSwgY29udHJvbCk7XG4gICAgfVxuXG4gICAgY29uc3QgdmFsaWRhdG9ycyA9IHRoaXMuZ2V0VmFsaWRhdG9ycygpO1xuICAgIGNvbnRyb2wuc2V0VmFsaWRhdG9ycyh2YWxpZGF0b3JzKTtcblxuICAgIC8vIE1hbmFnZSB0aGUgZGlzYWJsZWQgc3RhdGUgdXNpbmcgZm9ybSBjb250cm9sXG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICBpZiAodGhpcy5mb3JtRmllbGQuZGlzYWJsZWQgIT09IHVuZGVmaW5lZCkge1xuICAgICAgICBpZiAodGhpcy5mb3JtRmllbGQuZGlzYWJsZWQpIHtcbiAgICAgICAgICBjb250cm9sLmRpc2FibGUoeyBlbWl0RXZlbnQ6IGZhbHNlIH0pO1xuICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgIGNvbnRyb2wuZW5hYmxlKHsgZW1pdEV2ZW50OiBmYWxzZSB9KTtcbiAgICAgICAgfVxuICAgICAgfVxuXG4gICAgICBjb250cm9sLnVwZGF0ZVZhbHVlQW5kVmFsaWRpdHkoeyBlbWl0RXZlbnQ6IGZhbHNlIH0pO1xuICAgIH0pO1xuICB9XG5cbiAgcHJpdmF0ZSBnZXRWYWxpZGF0b3JzKCkge1xuICAgIGNvbnN0IHZhbGlkYXRvcnMgPSBbXTtcbiAgICBpZiAodGhpcy5mb3JtRmllbGQucmVxdWlyZWQpIHtcbiAgICAgIHZhbGlkYXRvcnMucHVzaChWYWxpZGF0b3JzLnJlcXVpcmVkKTtcbiAgICB9XG4gICAgcmV0dXJuIHZhbGlkYXRvcnM7XG4gIH1cblxuICBnZXRFcnJvck1lc3NhZ2UoKTogc3RyaW5nIHtcbiAgICBjb25zdCBjb250cm9sID0gdGhpcy5mb3JtR3JvdXAuZ2V0KHRoaXMuZm9ybUZpZWxkLm5hbWUpO1xuICAgIGlmIChjb250cm9sPy5oYXNFcnJvcigncmVxdWlyZWQnKSkge1xuICAgICAgcmV0dXJuIHRoaXMuZm9ybUZpZWxkLmVycm9yVGV4dCB8fCBgJHt0aGlzLmZvcm1GaWVsZC5sYWJlbH0gaXMgcmVxdWlyZWRgO1xuICAgIH1cbiAgICByZXR1cm4gJyc7XG4gIH1cbn1cbiIsIjxkaXZcbiAgW2Zvcm1Hcm91cF09XCJmb3JtR3JvdXBcIlxuICBjbGFzcz1cImZvcm0tZmllbGRcIlxuICBbbmdTdHlsZV09XCJ7IHdpZHRoOiBmb3JtRmllbGQud2lkdGggfHwgJzEwMCUnIH1cIlxuICAqbmdJZj1cIiFmb3JtRmllbGQuaGlkZGVuXCJcbj5cbiAgPGxhYmVsICpuZ0lmPVwiZm9ybUZpZWxkLmxhYmVsXCI+e3sgZm9ybUZpZWxkLmxhYmVsIH19PC9sYWJlbD5cbiAgPHAtZHJvcGRvd25cbiAgICBbZm9ybUNvbnRyb2xOYW1lXT1cImZvcm1GaWVsZC5uYW1lXCJcbiAgICBbb3B0aW9uc109XCJmb3JtRmllbGQub3B0aW9uc1wiXG4gICAgW3BsYWNlaG9sZGVyXT1cImZvcm1GaWVsZC5wbGFjZWhvbGRlciB8fCAnU2VsZWN0IGFuIG9wdGlvbidcIlxuICAgIG9wdGlvbkxhYmVsPVwibGFiZWxcIlxuICA+PC9wLWRyb3Bkb3duPlxuICA8ZGl2XG4gICAgKm5nSWY9XCJcbiAgICAgIGZvcm1Hcm91cC5nZXQoZm9ybUZpZWxkLm5hbWUpPy5pbnZhbGlkICYmXG4gICAgICBmb3JtR3JvdXAuZ2V0KGZvcm1GaWVsZC5uYW1lKT8udG91Y2hlZFxuICAgIFwiXG4gID5cbiAgICA8c21hbGwgY2xhc3M9XCJwLWVycm9yXCI+e3sgZ2V0RXJyb3JNZXNzYWdlKCkgfX08L3NtYWxsPlxuICA8L2Rpdj5cbjwvZGl2PlxuIl19