Skip to content

Commit 9d38f36

Browse files
authored
build: update @angular to 4.0.0 and refactor (#15)
1 parent 623b05e commit 9d38f36

16 files changed

+113
-117
lines changed

app/action-bar/action-bar-first.component.ts

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
1-
import {Component} from '@angular/core';
1+
import {Component} from "@angular/core";
22

33
@Component({
44
selector: "first-action-bar",
55
template: `
6-
<ActionBar title="Title 1" automationText="title">
7-
<ActionItem *ngIf="show" text="action" (tap)="onTap()" [nsRouterLink]="['/second']"></ActionItem>
8-
<ActionItem (tap)="onShare()" ios.systemIcon="9" ios.position="left"
9-
android.systemIcon="ic_menu_share_holo_light" android.position="actionBar"></ActionItem>
10-
<ActionItem text="delete" (tap)="onDelete()"
11-
ios.systemIcon="16" ios.position="right" android.position="popup"></ActionItem>
12-
</ActionBar>
13-
14-
<StackLayout verticalAlignment="center">
15-
<Label [text]="messageShare"></Label>
16-
<Label [text]="messageDelete"></Label>
17-
</StackLayout>
6+
<ActionBar title="Title 1" automationText="title">
7+
<ActionItem *ngIf="show" text="action" (tap)="onTap()" [nsRouterLink]="['/second']"></ActionItem>
8+
<ActionItem (tap)="onShare()" ios.systemIcon="9" ios.position="left"
9+
android.systemIcon="ic_menu_share_holo_light" android.position="actionBar"></ActionItem>
10+
<ActionItem text="delete" (tap)="onDelete()"
11+
ios.systemIcon="16" ios.position="right" android.position="popup"></ActionItem>
12+
</ActionBar>
13+
14+
<StackLayout verticalAlignment="center">
15+
<Label [text]="messageShare"></Label>
16+
<Label [text]="messageDelete"></Label>
17+
</StackLayout>
1818
`,
1919
})
2020
export class FirstComponentActionBar {

app/action-bar/action-bar-nested.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {Component} from '@angular/core';
1+
import {Component} from "@angular/core";
22

33
@Component({
44
selector: "nested-component",

app/action-bar/action-bar-second.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {Component} from '@angular/core';
1+
import {Component} from "@angular/core";
22

33
@Component({
44
selector: "second-action-bar",

app/app.routes.ts

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -25,39 +25,39 @@ import { NavigationInfoComponent } from "./navigation-options/navigation-info.co
2525
import { MainComponent } from "./main/main-page-router-outlet";
2626

2727

28-
export var routableComponents = [];
28+
export let routableComponents = [];
2929

3030
// Set isNavigatable: trueif the page is a mian page to other sub pages
3131
export const routes = [
32-
routeEntry({ path: '', component: MainComponent, data: { title: "" } }),
33-
routeEntry({ path: '', component: ModalContent, data: { title: "" } }),
34-
routeEntry({ path: 'template', component: AppComponent, data: { title: "Template", isNavigatable: true} }),
32+
routeEntry({ path: "", component: MainComponent, data: { title: "" } }),
33+
routeEntry({ path: "", component: ModalContent, data: { title: "" } }),
34+
routeEntry({ path: "template", component: AppComponent, data: { title: "Template", isNavigatable: true} }),
3535

36-
routeEntry({ path: 'router', component: NavigationTestRouter, children: NavigationSubRoutes, data: { title: "Router", isNavigatable: true} }),
36+
routeEntry({ path: "router", component: NavigationTestRouter, children: NavigationSubRoutes, data: { title: "Router", isNavigatable: true} }),
3737

38-
routeEntry({ path: 'first', component: FirstComponent, data: { title: "First", isNavigatable: true} }),
39-
routeEntry({ path: 'second', component: SecondComponent, data: { title: "Second", isNavigatable: true} }),
38+
routeEntry({ path: "first", component: FirstComponent, data: { title: "First", isNavigatable: true} }),
39+
routeEntry({ path: "second", component: SecondComponent, data: { title: "Second", isNavigatable: true} }),
4040

41-
routeEntry({ path: 'first-action-bar', component: FirstComponentActionBar, data: { title: "ActionBar1", isNavigatable: true} }),
42-
routeEntry({ path: 'second-action-bar', component: SecondComponentActionBar, data: { title: "ActionBar2", isNavigatable: true} }),
41+
routeEntry({ path: "first-action-bar", component: FirstComponentActionBar, data: { title: "ActionBar1", isNavigatable: true} }),
42+
routeEntry({ path: "second-action-bar", component: SecondComponentActionBar, data: { title: "ActionBar2", isNavigatable: true} }),
4343

44-
routeEntry({ path: 'binding', component: BindingComponent, data: { title: "Binding", isNavigatable: true} }),
44+
routeEntry({ path: "binding", component: BindingComponent, data: { title: "Binding", isNavigatable: true} }),
4545

46-
routeEntry({ path: 'ListViewExamples', component: ListViewMainPageComponent, data: { title: "ListViewExamples", isNavigatable: true} }),
47-
routeEntry({ path: 'listView/commonTemplate', component: ListViewComponent, data: { title: "commonTemplate" } }),
48-
routeEntry({ path: 'listView/customTemplate', component: ListViewControlComponent, data: { title: "customTemplate" } }),
49-
routeEntry({ path: 'listView/asyncPipeTemplate', component: ListViewAsyncPipeComponent, data: { title: "asyncPipeTemplate" } }),
50-
routeEntry({ path: 'listView/nestedTemplate', component: ListViewWithNestedTemplateComponent, data: { title: "nestedTemplate" } }),
46+
routeEntry({ path: "ListViewExamples", component: ListViewMainPageComponent, data: { title: "ListViewExamples", isNavigatable: true} }),
47+
routeEntry({ path: "listView/commonTemplate", component: ListViewComponent, data: { title: "commonTemplate" } }),
48+
routeEntry({ path: "listView/customTemplate", component: ListViewControlComponent, data: { title: "customTemplate" } }),
49+
routeEntry({ path: "listView/asyncPipeTemplate", component: ListViewAsyncPipeComponent, data: { title: "asyncPipeTemplate" } }),
50+
routeEntry({ path: "listView/nestedTemplate", component: ListViewWithNestedTemplateComponent, data: { title: "nestedTemplate" } }),
5151

52-
routeEntry({ path: 'modal', component: ModalViewMainPageComponent, data: { title: "Modals", isNavigatable: true} }),
53-
routeEntry({ path: 'modal/modal-dialogs', component: ModalTest, data: { title: "modal" } }),
54-
routeEntry({ path: 'modal/modal-dialogs-push', component: ModalTestWithPushStrategy, data: { title: "modal(onPush)" } }),
52+
routeEntry({ path: "modal", component: ModalViewMainPageComponent, data: { title: "Modals", isNavigatable: true} }),
53+
routeEntry({ path: "modal/modal-dialogs", component: ModalTest, data: { title: "modal" } }),
54+
routeEntry({ path: "modal/modal-dialogs-push", component: ModalTestWithPushStrategy, data: { title: "modal(onPush)" } }),
5555

56-
routeEntry({ path: 'nav-options', component: NavigationOptionsComponent, data: { title: "nav-options", isNavigatable: true} }),
57-
routeEntry({ path: 'nav-info', component: NavigationInfoComponent, data: { title: "nav-info" } }),
56+
routeEntry({ path: "nav-options", component: NavigationOptionsComponent, data: { title: "nav-options", isNavigatable: true} }),
57+
routeEntry({ path: "nav-info", component: NavigationInfoComponent, data: { title: "nav-info" } }),
5858
];
5959

6060
function routeEntry(data) {
61-
routableComponents.push(data.component)
61+
routableComponents.push(data.component);
6262
return data;
6363
}

app/binding/binding-page.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ export class BindingComponent {
2323
private _twoWayDataBinding: string;
2424
private _curlyBracket: string;
2525
private _result: string;
26-
public completedDate: Date = new Date(2016,5,3);
26+
public completedDate: Date = new Date(2016, 5, 3);
2727

2828
constructor() {
2929
this.refresh();
@@ -70,6 +70,6 @@ export class BindingComponent {
7070
this._oneWayDataBinding = "1";
7171
this._twoWayDataBinding = "2";
7272
this._curlyBracket = "5";
73-
this._result = ""
73+
this._result = "";
7474
}
7575
}
Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,20 @@
1-
import { Observable as RxObservable } from 'rxjs/Observable';
2-
import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
1+
import { Observable as RxObservable } from "rxjs/Observable";
2+
import { Component, Input, ChangeDetectionStrategy } from "@angular/core";
33

44
export class DataItem {
55
constructor(public id: number, public name: string) { }
66
}
77

88
@Component({
9-
selector: 'list-test-async',
9+
selector: "list-test-async",
1010
template: `
1111
<GridLayout rows='*,60' automationText="mainView">
1212
<ListView [items]="myItems | async">
13-
<template let-item="item" let-i="index" let-odd="odd" let-even="even">
13+
<ng-template let-item="item" let-i="index" let-odd="odd" let-even="even">
1414
<StackLayout [class.odd]="odd" [class.even]="even">
1515
<Label [text]='"index: " + item.name'></Label>
1616
</StackLayout>
17-
</template>
17+
</ng-template>
1818
</ListView>
1919
<TextView row='1' [text]='output' automationText="tvResult" textWrap="true"></TextView>
2020
</GridLayout>
@@ -26,19 +26,19 @@ export class ListViewAsyncPipeComponent {
2626
public output: string;
2727

2828
constructor() {
29-
var items = [];
30-
for (var i = 0; i < 3; i++) {
29+
let items = [];
30+
for (let i = 0; i < 3; i++) {
3131
items.push(new DataItem(i, "data item " + i));
3232
}
3333

34-
var subscr;
34+
let subscr;
3535
this.myItems = RxObservable.create(subscriber => {
3636
subscr = subscriber;
3737
subscriber.next(items);
3838
return function () {
3939
console.log("Unsubscribe called!!!");
4040
this.output = "Unsubscribe called!!!";
41-
}
41+
};
4242
});
4343

4444
let counter = 2;
@@ -52,4 +52,4 @@ export class ListViewAsyncPipeComponent {
5252
clearInterval(intervalId);
5353
}, 5000);
5454
}
55-
}
55+
}
Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,21 @@
1-
import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
1+
import { Component, Input, ChangeDetectionStrategy } from "@angular/core";
22

33
@Component({
4-
selector: 'list-test',
5-
styleUrls: ['./listView/commonTemplate/list-view-page.css'],
6-
template: `
7-
<StackLayout automationText="mainView">
8-
<ListView [items]="myItems" (itemTap)="onItemTap($event)">
9-
<template let-item="item" let-i="index" let-odd="odd" let-even="even">
10-
<StackLayout [class.odd]="odd" [class.even]="even">
11-
<Label [text]='"index: " + i'></Label>
12-
<Label [text]='"[" + item.id +"] " + item.name'></Label>
13-
</StackLayout>
14-
</template>
15-
</ListView>
16-
<TextView [text]="results" automationText="tvResults" textWrap="true"></TextView>
17-
</StackLayout>
18-
`,
4+
selector: "list-test",
5+
styleUrls: ["./listView/commonTemplate/list-view-page.css"],
6+
template: `
7+
<StackLayout automationText="mainView">
8+
<ListView [items]="myItems" (itemTap)="onItemTap($event)">
9+
<ng-template let-item="item" let-i="index" let-odd="odd" let-even="even">
10+
<StackLayout [class.odd]="odd" [class.even]="even">
11+
<Label [text]='"index: " + i'></Label>
12+
<Label [text]='"[" + item.id +"] " + item.name'></Label>
13+
</StackLayout>
14+
</ng-template>
15+
</ListView>
16+
<TextView [text]="results" automationText="tvResults" textWrap="true"></TextView>
17+
</StackLayout>
18+
`,
1919
changeDetection: ChangeDetectionStrategy.OnPush
2020
})
2121

@@ -25,10 +25,10 @@ export class ListViewComponent {
2525
private counter: number;
2626

2727
constructor() {
28-
this.results = '';
28+
this.results = "";
2929
this.myItems = [];
3030
this.counter = 0;
31-
for (var i = 0; i < 5; i++) {
31+
for (let i = 0; i < 5; i++) {
3232
this.myItems.push(new DataItem(i, "data item " + i));
3333
this.counter = i;
3434
}
@@ -42,4 +42,4 @@ export class ListViewComponent {
4242

4343
class DataItem {
4444
constructor(public id: number, public name: string) { }
45-
}
45+
}
Lines changed: 8 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
1+
import { Component, Input, ChangeDetectionStrategy } from "@angular/core";
22

33
@Component({
4-
selector: 'custom-template',
4+
selector: "custom-template",
55
template: `
66
<StackLayout>
77
<Label *ngFor="let element of data.list" [text]="element.text"></Label>
@@ -14,13 +14,13 @@ export class CustomTemplate {
1414
}
1515

1616
@Component({
17-
selector: 'list-test',
17+
selector: "list-test",
1818
template: `
19-
<GridLayout rows="*" automationText="mainView">
19+
<GridLayout rows="*" automationText="mainView">
2020
<ListView [items]="myItems">
21-
<template let-item="item">
21+
<ng-template let-item="item">
2222
<custom-template [data]="item"></custom-template>
23-
</template>
23+
</ng-template>
2424
</ListView>
2525
</GridLayout>
2626
`,
@@ -31,9 +31,8 @@ export class ListViewControlComponent {
3131
private counter: number;
3232

3333
constructor() {
34-
var list = [{ "text": "a" }, { "text": "b" }];
35-
var list1 = [{ "text": "c" }, { "text": "d" }];
34+
let list = [{ "text": "a" }, { "text": "b" }];
35+
let list1 = [{ "text": "c" }, { "text": "d" }];
3636
this.myItems = [{ "list": list }, { "list": list1 }];
3737
}
3838
}
39-
Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
1-
import { Component, ChangeDetectionStrategy } from '@angular/core';
1+
import { Component, ChangeDetectionStrategy } from "@angular/core";
22

33
@Component({
4-
selector: 'list-test',
4+
selector: "list-test",
55
template: `
6-
<GridLayout rows="* auto" automationText="mainView">
6+
<GridLayout rows="* auto" automationText="mainView">
77
<ListView [items]="myItems">
8-
<template let-item="item">
8+
<ng-template let-item="item">
99
<GridLayout>
1010
<Label [text]="'Item ' + item"></Label>
1111
<Label *ngIf="item === 'error'" text="ERROR"></Label>
1212
</GridLayout>
13-
</template>
13+
</ng-template>
1414
</ListView>
1515
1616
<Button text="navigate" row="1" [nsRouterLink]="['/first']"></Button>
@@ -20,7 +20,4 @@ import { Component, ChangeDetectionStrategy } from '@angular/core';
2020
})
2121
export class ListViewWithNestedTemplateComponent {
2222
public myItems: string[] = ["one", "two"];
23-
24-
constructor() {
25-
}
2623
}

app/main/main-page-router-outlet.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,12 @@ import * as platform from "platform";
1212
})
1313
export class MainComponent {
1414
private _routers = [];
15-
private _routes = require("../app.routes").routes
15+
private _routes = require("../app.routes").routes;
1616
private _orientation: string = "vertical";
1717

1818
constructor() {
1919
let routs = this._routes.filter((item) => {
20-
let isNavigatable = item.data.isNavigatable != undefined && item.data.isNavigatable == true && item.path != '';
20+
let isNavigatable = item.data.isNavigatable != undefined && item.data.isNavigatable == true && item.path != "";
2121
console.log("Page route:" + item.path + "; page name: " + item.data.title + "; isNavigatable: " + isNavigatable);
2222
return isNavigatable;
2323
});
@@ -38,7 +38,7 @@ export class MainComponent {
3838
}
3939

4040
@Component({
41-
selector: 'navigation-main',
41+
selector: "navigation-main",
4242
template: `<page-router-outlet></page-router-outlet>`
4343
})
4444
export class NavigationMainPageRouter { }

app/modal/modal-dialogs/modal-dialog.component.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import { Component, ChangeDetectionStrategy, ViewContainerRef, ChangeDetectorRef } from '@angular/core';
1+
import { Component, ChangeDetectionStrategy, ViewContainerRef, ChangeDetectorRef } from "@angular/core";
22
import { ModalDialogService, ModalDialogOptions, ModalDialogParams } from "nativescript-angular/directives/dialogs";
33

44
@Component({
5-
selector: 'modal-content',
5+
selector: "modal-content",
66
template: `
77
<StackLayout margin="24" horizontalAlignment="center" verticalAlignment="center">
88
<Label [text]="prompt"></Label>
@@ -34,7 +34,7 @@ const TEMPLATE = `
3434
`;
3535

3636
@Component({
37-
selector: 'modal-test',
37+
selector: "modal-test",
3838
providers: [ModalDialogService],
3939
template: TEMPLATE
4040
})
@@ -63,7 +63,7 @@ export class ModalTest {
6363
}
6464

6565
@Component({
66-
selector: 'modal-test-on-push',
66+
selector: "modal-test-on-push",
6767
changeDetection: ChangeDetectionStrategy.OnPush,
6868
template: TEMPLATE
6969
})

app/navigation-options/navigation-info.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import {Component} from '@angular/core';
1+
import {Component} from "@angular/core";
22
import {NSLocationStrategy} from "nativescript-angular/router/ns-location-strategy";
33
import {Frame} from "ui/frame";
44

55

66
@Component({
7-
selector: 'nav-info',
7+
selector: "nav-info",
88
template: `
99
<StackLayout>
1010
<Label [text]="'frameStack: ' + frameStack" ></Label>

app/navigation-options/navigation-options.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import {Component} from '@angular/core';
1+
import {Component} from "@angular/core";
22
import {RouterExtensions} from "nativescript-angular/router";
33

44
@Component({
5-
selector: 'nav-options',
5+
selector: "nav-options",
66
template: `
77
<StackLayout>
88
<Button text="clear-history" [nsRouterLink]="['/nav-info']" [clearHistory]="true"></Button>

0 commit comments

Comments
 (0)