ngx-dynamic
Version:
dynamic contents projection in Angular
74 lines (73 loc) • 1.98 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var renderer_1 = require("./renderer");
/**
* ComponentOutlet is a directive to create dynamic component.
*
* Example:
*
* ```ts
* @Component({
* selector: 'my-app',
* template: `
* <dynamic-html [content]="content"></dynamic-html>
* `
* })
* export class AppComponent {
* content = `
* <article>
* <h1>Awesome Document</h1>
* <div>
* <p>bla bla bla</p>
* <my-button></my-button>
* </div>
* </article>
* `;
* }
* ```
*
*/
var DynamicHTMLComponent = (function () {
function DynamicHTMLComponent(renderer, elementRef) {
this.renderer = renderer;
this.elementRef = elementRef;
this.ref = null;
}
DynamicHTMLComponent.prototype.ngOnChanges = function (_) {
if (this.ref) {
this.ref.destroy();
this.ref = null;
}
if (this.content && this.elementRef) {
this.ref = this.renderer.renderInnerHTML(this.elementRef, this.content);
}
};
DynamicHTMLComponent.prototype.ngDoCheck = function () {
if (this.ref) {
this.ref.check();
}
};
DynamicHTMLComponent.prototype.ngOnDestroy = function () {
if (this.ref) {
this.ref.destroy();
this.ref = null;
}
};
DynamicHTMLComponent.decorators = [
{ type: core_1.Component, args: [{
selector: 'dynamic-html',
template: '',
},] },
];
/** @nocollapse */
DynamicHTMLComponent.ctorParameters = function () { return [
{ type: renderer_1.DynamicHTMLRenderer, },
{ type: core_1.ElementRef, },
]; };
DynamicHTMLComponent.propDecorators = {
"content": [{ type: core_1.Input },],
};
return DynamicHTMLComponent;
}());
exports.DynamicHTMLComponent = DynamicHTMLComponent;