angular 5: templateRef.createEmbeddedView is not a function

According to angular 5 changelog:

The compiler option enableLegacyTemplate is now disabled by default as the element was deprecated since v4. Use <ng-template> instead.

So you should use ng-template instead of template:

<ng-template #tpl>
   <h1>ViewContainerRef</h1>
</ng-template>

Stackblitz Example

or set enableLegacyTemplate to true:

platformBrowserDynamic().bootstrapModule(AppModule, { enableLegacyTemplate: true })

Stackblitz Example

But you should know that

The option enableLegacyTemplate and the <template> element will both be removed in Angular v6.


In my case the error was due to me forgetting * (asterisk) before ngTemplateOutlet


When you reference in the *ngIf, else clause can’t be any arbitrary component, but it must be a ng-template.

For eg,

in a component where you have a source code similar to this:

<div *ngIf="myCondition ; else elseSection">
    <!-- ... -->
</div>
<div #elseSection>
    <!-- ... -->
</div>

The resulting source code should look like this:

<div *ngIf="myCondition ; else elseSection">
    <!-- ... -->
</div>
<ng-template #elseSection>
    <!-- ... -->
</ng-template>

ref : https://techoverflow.net/2018/02/17/how-to-fix-angular-typeerror-templateref-createembeddedview-is-not-a-function/