1 import { Component, ElementRef, Input, OnChanges, ViewChild } from '@angular/core'
2 import { CustomMarkupService } from './custom-markup.service'
5 selector: 'my-custom-markup-container',
6 templateUrl: './custom-markup-container.component.html'
8 export class CustomMarkupContainerComponent implements OnChanges {
9 @ViewChild('contentWrapper', { static: true }) contentWrapper: ElementRef<HTMLInputElement>
11 @Input() content: string | HTMLDivElement
16 private customMarkupService: CustomMarkupService
19 async ngOnChanges () {
23 private async rebuild () {
24 if (this.content instanceof HTMLDivElement) {
25 return this.loadElement(this.content)
28 const { rootElement, componentsLoaded } = await this.customMarkupService.buildElement(this.content)
29 await componentsLoaded
31 return this.loadElement(rootElement)
34 private loadElement (el: HTMLDivElement) {
35 this.contentWrapper.nativeElement.appendChild(el)