Here is a simple demonstration of ngTemplate that I have coded:
<div> <ng-container [ngTemplateOutlet] ="template1"> </ng-container></div>
Below are the template examples:
<ng-template #template1> This is the 1st template </ng-template>
<ng-template #template2> This is the 2nd template </ng-template>
While everything is working as expected, I am encountering an issue trying to pass dynamic values to [ngTemplateOutlet]
.
The desired functionality is something like this:
<div> <ng-container [ngTemplateOutlet] ="selectTemplate"></ng-container> </div>
Where either template1
or template2
can be selected.
However, upon passing a dynamic value defined in my TypeScript file, an error occurs:
ERROR TypeError: templateRef.createEmbeddedView is not a function
The TypeScript code responsible for setting the dynamic value is as follows:
if(some condition) {
this.selectTemplate = "template1";
} else {
this.selectTemplate = "template2";
}