diff --git a/ng2-components/ng2-alfresco-datatable/src/components/datatable.component.html b/ng2-components/ng2-alfresco-datatable/src/components/datatable.component.html
index ba79bff70d..6bee3e7145 100644
--- a/ng2-components/ng2-alfresco-datatable/src/components/datatable.component.html
+++ b/ng2-components/ng2-alfresco-datatable/src/components/datatable.component.html
@@ -42,11 +42,11 @@
         <td *ngFor="let col of data.getColumns()" [ngSwitch]="col.type"
             class="mdl-data-table__cell--non-numeric non-selectable data-cell {{col.cssClass}}"
             (click)="onRowClick(row, $event)" (dblclick)="onRowDblClick(row, $event)">
-            <div *ngSwitchWhen="'image'">
+            <div *ngSwitchCase="'image'">
                 <i *ngIf="isIconValue(row, col)" class="material-icons icon-cell">{{asIconValue(row, col)}}</i>
                 <img *ngIf="!isIconValue(row, col)" class="image-cell" alt="" src="{{data.getValue(row, col)}}">
             </div>
-            <div *ngSwitchWhen="'text'">
+            <div *ngSwitchCase="'text'">
                 {{data.getValue(row, col)}}
             </div>
             <span *ngSwitchDefault>
diff --git a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html
index d2b9884835..99a60072ec 100644
--- a/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html
+++ b/ng2-components/ng2-alfresco-documentlist/src/components/document-list.html
@@ -1,6 +1,6 @@
 <ol *ngIf="breadcrumb" data-automation-id="breadcrumb" class="breadcrumb">
     <li *ngFor="let r of route; let last = last" [class.active]="last" [ngSwitch]="last">
-        <span *ngSwitchWhen="true">{{r.name}}</span>
+        <span *ngSwitchCase="true">{{r.name}}</span>
         <a *ngSwitchDefault href="#" [attr.data-automation-id]="'breadcrumb_' + r.name" (click)="goToRoute(r, $event)">{{r.name}}</a>
     </li>
 </ol>
@@ -46,10 +46,10 @@
             (dblclick)="onItemDblClick(content, $event)"
             [context-menu]="getContextActions(content)"
             [attr.data-automation-id]="col.source === '$thumbnail' ? '$thumbnail' : col.source + '_' + getObjectValue(content.entry, col.source)">
-            <div *ngSwitchWhen="'image'" class="cell-value">
+            <div *ngSwitchCase="'image'" class="cell-value">
                 <img class="thumbnail" [src]="getCellValue(content, col)">
             </div>
-            <span *ngSwitchWhen="'date'" class="cell-value">
+            <span *ngSwitchCase="'date'" class="cell-value">
                 {{ getCellValue(content, col) }}
             </span>
             <span *ngSwitchDefault class="cell-value">