How to dynamically create a template in Angular 2 4.x?

Question

Angular

Please, gentlemen, give a hint.
There is a DOM structure that is dynamically generated, for example this . I want to place this house structure in a component so that instructions like {{1+1}} and, in general, any instructions of the template engine are correctly processed. Who can tell how to do it? '<p>{{1+1}}</p>'

Answer 1

You can try with NgComponentOutlet
Something like this:

@Component({
  template: `<ng-container *ngComponentOutlet="myComponent"></ng-container>`
})
export class MyContainerComponent {

  @Input()
  myTemplate: string;

  get myComponent(): Type<any> {

    const template = this.myTemplate;

    @Component({template})
    class MyComponent {
    };

    return MyComponent;
  }
}

Most likely will not work with AOT.