refactor: migrate template => ng-template

Author: sis0k0

app/listView/asyncPipeTemplate/async-pipe-template.ts

@@ -10,11 +10,11 @@ export class DataItem {
     template: `
     <GridLayout rows='*,60' automationText="mainView">
         <ListView [items]="myItems | async">
-            <template let-item="item" let-i="index" let-odd="odd" let-even="even">
+            <ng-template let-item="item" let-i="index" let-odd="odd" let-even="even">
                 <StackLayout [class.odd]="odd" [class.even]="even">
                     <Label [text]='"index: " + item.name'></Label>
                 </StackLayout>
-            </template>
+            </ng-template>
         </ListView>
         <TextView  row='1' [text]='output' automationText="tvResult" textWrap="true"></TextView>
     </GridLayout>
@@ -52,4 +52,4 @@ export class ListViewAsyncPipeComponent {
             clearInterval(intervalId);
         }, 5000);
     }
-}
+}

app/listView/commonTemplate/list-view-page.ts

@@ -6,12 +6,12 @@ import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
     template: ` 
                 <StackLayout automationText="mainView">
                     <ListView [items]="myItems" (itemTap)="onItemTap($event)">
-                        <template let-item="item" let-i="index" let-odd="odd" let-even="even">
+                        <ng-template let-item="item" let-i="index" let-odd="odd" let-even="even">
                             <StackLayout [class.odd]="odd" [class.even]="even">
                                 <Label [text]='"index: " + i'></Label>
                                 <Label [text]='"[" + item.id +"] " + item.name'></Label>
                             </StackLayout>
-                        </template>
+                        </ng-template>
                     </ListView>
                     <TextView [text]="results" automationText="tvResults" textWrap="true"></TextView>
                 </StackLayout>
@@ -42,4 +42,4 @@ export class ListViewComponent {
 
 class DataItem {
     constructor(public id: number, public name: string) { }
-}
+}

app/listView/customTemplate/list-view-item-template.ts

@@ -18,9 +18,9 @@ export class CustomTemplate {
     template: `
         <GridLayout rows="*" automationText="mainView"> 
             <ListView [items]="myItems">
-                <template let-item="item">
+                <ng-template let-item="item">
                     <custom-template [data]="item"></custom-template>
-                </template>
+                </ng-template>
             </ListView>
         </GridLayout>
     `,

app/listView/nestedTemplate/list-view-nested-template.ts

@@ -5,12 +5,12 @@ import { Component, ChangeDetectionStrategy } from '@angular/core';
     template: `
         <GridLayout rows="* auto" automationText="mainView"> 
             <ListView [items]="myItems">
-                <template let-item="item">
+                <ng-template let-item="item">
                     <GridLayout>
                         <Label [text]="'Item ' + item"></Label>
                         <Label *ngIf="item === 'error'" text="ERROR"></Label>
                     </GridLayout>
-                </template>
+                </ng-template>
             </ListView>
 
             <Button text="navigate" row="1" [nsRouterLink]="['/first']"></Button>