survey-angular-ui
Version:
A free MIT-licensed Angular UI component that renders dynamic, interactive JSON-based forms and surveys. You can use it to collect responses from users and send them to your own database.
53 lines • 7.92 kB
JavaScript
import { Directive, Input, NgModuleRef } from "@angular/core";
import { AngularComponentFactory } from "../component-factory";
import * as i0 from "@angular/core";
export class DynamicComponentDirective {
constructor(containerRef, templateRef, injector) {
this.containerRef = containerRef;
this.templateRef = templateRef;
this.injector = injector;
}
ngOnChanges(changes) {
var _a;
const componentChanges = changes["component"];
if (componentChanges.currentValue.name !== ((_a = componentChanges.previousValue) === null || _a === void 0 ? void 0 : _a.name) ||
(componentChanges.currentValue.name === undefined && componentChanges.previousValue === undefined && !this.componentInstance)) {
this.createComponent();
}
else {
this.updateComponentData();
}
}
createComponent() {
this.containerRef.clear();
const componentName = AngularComponentFactory.Instance.isComponentRegistered(this.component.name) ? this.component.name : this.component.default;
if (componentName) {
const resolver = this.injector.get(NgModuleRef).componentFactoryResolver;
this.componentInstance = AngularComponentFactory.Instance.create(this.containerRef, componentName, resolver).instance;
}
if (!this.componentInstance) {
throw new Error(`Can't create component with name: ${this.component.name} and default: ${this.component.default}`);
}
else {
this.componentInstance.contentTempl = this.templateRef;
}
this.updateComponentData();
}
updateComponentData() {
const data = this.component.data;
Object.keys(data).forEach((key) => {
this.componentInstance[key] = data[key];
});
}
}
DynamicComponentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DynamicComponentDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.TemplateRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive });
DynamicComponentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: DynamicComponentDirective, selector: "[component]", inputs: { component: "component" }, usesOnChanges: true, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DynamicComponentDirective, decorators: [{
type: Directive,
args: [{
selector: "[component]"
}]
}], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: i0.TemplateRef }, { type: i0.Injector }]; }, propDecorators: { component: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHluYW1pYy5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvdXRpbHMvZHluYW1pYy5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQUUsV0FBVyxFQUFxRSxNQUFNLGVBQWUsQ0FBQztBQUM3SSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7QUFZL0QsTUFBTSxPQUFPLHlCQUF5QjtJQUNwQyxZQUFvQixZQUE4QixFQUFVLFdBQWlDLEVBQVUsUUFBa0I7UUFBckcsaUJBQVksR0FBWixZQUFZLENBQWtCO1FBQVUsZ0JBQVcsR0FBWCxXQUFXLENBQXNCO1FBQVUsYUFBUSxHQUFSLFFBQVEsQ0FBVTtJQUFJLENBQUM7SUFHOUgsV0FBVyxDQUFDLE9BQXNCOztRQUNoQyxNQUFNLGdCQUFnQixHQUFHLE9BQU8sQ0FBQyxXQUFXLENBQUMsQ0FBQztRQUM5QyxJQUFJLGdCQUFnQixDQUFDLFlBQVksQ0FBQyxJQUFJLE1BQUssTUFBQSxnQkFBZ0IsQ0FBQyxhQUFhLDBDQUFFLElBQUksQ0FBQTtZQUM3RSxDQUFDLGdCQUFnQixDQUFDLFlBQVksQ0FBQyxJQUFJLEtBQUssU0FBUyxJQUFJLGdCQUFnQixDQUFDLGFBQWEsS0FBSyxTQUFTLElBQUksQ0FBQyxJQUFJLENBQUMsaUJBQWlCLENBQUMsRUFBRTtZQUMvSCxJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7U0FDeEI7YUFBTTtZQUNMLElBQUksQ0FBQyxtQkFBbUIsRUFBRSxDQUFDO1NBQzVCO0lBQ0gsQ0FBQztJQUNELGVBQWU7UUFDYixJQUFJLENBQUMsWUFBWSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQzFCLE1BQU0sYUFBYSxHQUFHLHVCQUF1QixDQUFDLFFBQVEsQ0FBQyxxQkFBcUIsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxPQUFPLENBQUM7UUFDakosSUFBSSxhQUFhLEVBQUU7WUFDakIsTUFBTSxRQUFRLEdBQUksSUFBSSxDQUFDLFFBQVEsQ0FBQyxHQUFHLENBQUMsV0FBVyxDQUFTLENBQUMsd0JBQXdCLENBQUM7WUFDbEYsSUFBSSxDQUFDLGlCQUFpQixHQUFHLHVCQUF1QixDQUFDLFFBQVEsQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLFlBQVksRUFBRSxhQUFhLEVBQUUsUUFBUSxDQUFDLENBQUMsUUFBUSxDQUFDO1NBQ3ZIO1FBQ0QsSUFBSSxDQUFDLElBQUksQ0FBQyxpQkFBaUIsRUFBRTtZQUMzQixNQUFNLElBQUksS0FBSyxDQUFDLHFDQUFxQyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksaUJBQWlCLElBQUksQ0FBQyxTQUFTLENBQUMsT0FBTyxFQUFFLENBQUMsQ0FBQztTQUNwSDthQUFNO1lBQ0wsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFlBQVksR0FBRyxJQUFJLENBQUMsV0FBVyxDQUFDO1NBQ3hEO1FBQ0QsSUFBSSxDQUFDLG1CQUFtQixFQUFFLENBQUM7SUFDN0IsQ0FBQztJQUNELG1CQUFtQjtRQUNqQixNQUFNLElBQUksR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQztRQUNqQyxNQUFNLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFO1lBQ2hDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7UUFDMUMsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDOzt1SEFoQ1UseUJBQXlCOzJHQUF6Qix5QkFBeUI7NEZBQXpCLHlCQUF5QjtrQkFKckMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsYUFBYTtpQkFDeEI7d0pBSVUsU0FBUztzQkFBakIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIE5nTW9kdWxlUmVmLCBPbkNoYW5nZXMsIFNpbXBsZUNoYW5nZXMsIFRlbXBsYXRlUmVmLCBWaWV3Q29udGFpbmVyUmVmLCBJbmplY3RvciB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBBbmd1bGFyQ29tcG9uZW50RmFjdG9yeSB9IGZyb20gXCIuLi9jb21wb25lbnQtZmFjdG9yeVwiO1xuXG5pbnRlcmZhY2UgSUR5bmFtaWNDb21wb25lbnQge1xuICBuYW1lOiBzdHJpbmc7XG4gIGRhdGE/OiBhbnk7XG4gIGRlZmF1bHQ/OiBzdHJpbmc7XG59XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogXCJbY29tcG9uZW50XVwiXG59KVxuXG5leHBvcnQgY2xhc3MgRHluYW1pY0NvbXBvbmVudERpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgY29udGFpbmVyUmVmOiBWaWV3Q29udGFpbmVyUmVmLCBwcml2YXRlIHRlbXBsYXRlUmVmOiBUZW1wbGF0ZVJlZjx1bmtub3duPiwgcHJpdmF0ZSBpbmplY3RvcjogSW5qZWN0b3IpIHsgfVxuICBASW5wdXQoKSBjb21wb25lbnQhOiBJRHluYW1pY0NvbXBvbmVudDtcbiAgcHJpdmF0ZSBjb21wb25lbnRJbnN0YW5jZTogYW55O1xuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgY29uc3QgY29tcG9uZW50Q2hhbmdlcyA9IGNoYW5nZXNbXCJjb21wb25lbnRcIl07XG4gICAgaWYgKGNvbXBvbmVudENoYW5nZXMuY3VycmVudFZhbHVlLm5hbWUgIT09IGNvbXBvbmVudENoYW5nZXMucHJldmlvdXNWYWx1ZT8ubmFtZSB8fFxuICAgICAgKGNvbXBvbmVudENoYW5nZXMuY3VycmVudFZhbHVlLm5hbWUgPT09IHVuZGVmaW5lZCAmJiBjb21wb25lbnRDaGFuZ2VzLnByZXZpb3VzVmFsdWUgPT09IHVuZGVmaW5lZCAmJiAhdGhpcy5jb21wb25lbnRJbnN0YW5jZSkpIHtcbiAgICAgIHRoaXMuY3JlYXRlQ29tcG9uZW50KCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMudXBkYXRlQ29tcG9uZW50RGF0YSgpO1xuICAgIH1cbiAgfVxuICBjcmVhdGVDb21wb25lbnQoKTogdm9pZCB7XG4gICAgdGhpcy5jb250YWluZXJSZWYuY2xlYXIoKTtcbiAgICBjb25zdCBjb21wb25lbnROYW1lID0gQW5ndWxhckNvbXBvbmVudEZhY3RvcnkuSW5zdGFuY2UuaXNDb21wb25lbnRSZWdpc3RlcmVkKHRoaXMuY29tcG9uZW50Lm5hbWUpID8gdGhpcy5jb21wb25lbnQubmFtZSA6IHRoaXMuY29tcG9uZW50LmRlZmF1bHQ7XG4gICAgaWYgKGNvbXBvbmVudE5hbWUpIHtcbiAgICAgIGNvbnN0IHJlc29sdmVyID0gKHRoaXMuaW5qZWN0b3IuZ2V0KE5nTW9kdWxlUmVmKSBhcyBhbnkpLmNvbXBvbmVudEZhY3RvcnlSZXNvbHZlcjtcbiAgICAgIHRoaXMuY29tcG9uZW50SW5zdGFuY2UgPSBBbmd1bGFyQ29tcG9uZW50RmFjdG9yeS5JbnN0YW5jZS5jcmVhdGUodGhpcy5jb250YWluZXJSZWYsIGNvbXBvbmVudE5hbWUsIHJlc29sdmVyKS5pbnN0YW5jZTtcbiAgICB9XG4gICAgaWYgKCF0aGlzLmNvbXBvbmVudEluc3RhbmNlKSB7XG4gICAgICB0aHJvdyBuZXcgRXJyb3IoYENhbid0IGNyZWF0ZSBjb21wb25lbnQgd2l0aCBuYW1lOiAke3RoaXMuY29tcG9uZW50Lm5hbWV9IGFuZCBkZWZhdWx0OiAke3RoaXMuY29tcG9uZW50LmRlZmF1bHR9YCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuY29tcG9uZW50SW5zdGFuY2UuY29udGVudFRlbXBsID0gdGhpcy50ZW1wbGF0ZVJlZjtcbiAgICB9XG4gICAgdGhpcy51cGRhdGVDb21wb25lbnREYXRhKCk7XG4gIH1cbiAgdXBkYXRlQ29tcG9uZW50RGF0YSgpOiB2b2lkIHtcbiAgICBjb25zdCBkYXRhID0gdGhpcy5jb21wb25lbnQuZGF0YTtcbiAgICBPYmplY3Qua2V5cyhkYXRhKS5mb3JFYWNoKChrZXkpID0+IHtcbiAgICAgIHRoaXMuY29tcG9uZW50SW5zdGFuY2Vba2V5XSA9IGRhdGFba2V5XTtcbiAgICB9KTtcbiAgfVxufSJdfQ==