0

I have to dynamically (at runtime) create a component with template built of string. This string contains some tags that need to be replaced by Angular components.

For example

HTML template:

<div class="box"> <div>Lorem ipsum <strong>dolor sit amet</strong></div> Event date: <span id="datepicker"></span> - join us. </div>

needs to be transformed into:

<div class="box"> <div>Lorem ipsum <strong>dolor sit amet</strong></div> Event date: <custom-datepicker></custom-datepicker> <---- here should come Angular component - join us. </div>

and rendered.

I tried to do this by using "unofficial" function ɵcompileComponent and it works fine -> https://stackblitz.com/edit/stackblitz-starters-jtnufx

Unfortunetely it breaks when is built in the AOT mode (ng build --aot -c production). Getting error:

Uncaught Error: JIT compiler unavailable

I know that there is an option of disabling aot in angular.json but I don't want to do this.

Does anyone know how to handle this?

Improve this question
2
  • 1
    Did you try using innerHTML? Commented Mar 13, 2024 at 16:57
  • 1
    innerHTML just inserts pure HTML code. You cannot compile Angular components Commented Mar 14, 2024 at 7:07
Load 5 more related questions Show fewer related questions

0

Reset to default

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.