NgSwitch - behaves unexpected , `No provider for NgSwitch` - exception getting

Question

Here is my html:

<ng-container *ngIf="col.data !== ''">
    <ng-template [ngSwitch]="col.data">
        <ng-container *ngSwitchCase="'Page'">
            <div>{{getData(data, col.data, col.dataName)}}</div>
        </ng-container>
        <ng-container *ngSwitchDefault>
            {{getData(data, col.data, col.dataName)}}
        </ng-container>
    </ng-template>
</ng-container>

When I implement the switch case as I did in the code above, I get this error:

No provider for NgSwitch ("<ng-template [ngSwitch]="col.data"> [ERROR ->]<ng-container *ngSwitchCase="'Page'">

Like I said, Until I use the ngSwitch, it was working properly. I have already imported the common module too...

Can anyone help me sort out this issue?

Intinction

Answer 1

You cannot use [ngSwitch] on <ng-template>. You can either use it on HTML elements, or <ng-container>.

Armand

Answer 2

I got a similar No provider for NgSwitch parse error. For me, the cause of the problem was that I was using NgSwitch like *ngSwitch="..." (wrong) instead of [ngSwitch]="..." (correct). I hope this helps somebody :)

Seventh