NativeScript · hdeshev · Jan 4, 2017 · Dec 15, 2016
diff --git a/nativescript-angular/package.json b/nativescript-angular/package.json
@@ -22,15 +22,15 @@
   },
   "dependencies": {
     "nativescript-intl": "~0.0.8",
-    "@angular/core": "~2.2.1",
-    "@angular/common": "~2.2.1",
-    "@angular/compiler": "~2.2.1",
-    "@angular/http": "~2.2.1",
-    "@angular/platform-browser": "~2.2.1",
-    "@angular/platform-browser-dynamic": "~2.2.1",
-    "@angular/forms": "~2.2.1",
-    "@angular/router": "~3.2.1",
-    "rxjs": "5.0.0-beta.12",
+    "@angular/core": "~2.3.1",
+    "@angular/common": "~2.3.1",
+    "@angular/compiler": "~2.3.1",
+    "@angular/http": "~2.3.1",
+    "@angular/platform-browser": "~2.3.1",
+    "@angular/platform-browser-dynamic": "~2.3.1",
+    "@angular/forms": "~2.3.1",
+    "@angular/router": "~3.3.1",
+    "rxjs": "5.0.0-rc.4",
     "reflect-metadata": "~0.1.8",
     "parse5": "1.3.2",
     "punycode": "1.3.2",
@@ -41,10 +41,10 @@
     "typescript": "~2.0.10",
     "tslint": "~4.0.1",
     "codelyzer": "^2.0.0-beta.1",
-    "@angular/compiler-cli": "~2.2.1",
+    "@angular/compiler-cli": "~2.3.1",
     "codelyzer": "^2.0.0-beta.1",
     "tns-core-modules": ">=2.5.0 || >=2.5.0-2016",
-    "zone.js": "^0.6.21"
+    "zone.js": "^0.7.2"
   },
   "nativescript": {}
 }
diff --git a/nativescript-angular/router/ns-location-strategy.ts b/nativescript-angular/router/ns-location-strategy.ts
@@ -28,7 +28,7 @@ export class NSLocationStrategy extends LocationStrategy {
     private states = new Array<LocationState>();
     private popStateCallbacks = new Array<(_: any) => any>();
 
-    private _isPageNavigationgBack = false;
+    private _isPageNavigationBack = false;
     private _currentNavigationOptions: NavigationOptions;
 
     constructor(private frame: Frame) {
@@ -86,7 +86,7 @@ export class NSLocationStrategy extends LocationStrategy {
     }
 
     back(): void {
-        if (this._isPageNavigationgBack) {
+        if (this._isPageNavigationBack) {
             // We are navigating to the previous page 
             // clear the stack until we get to a page navigation state
             let state = this.states.pop();
@@ -154,22 +154,22 @@ export class NSLocationStrategy extends LocationStrategy {
     // Methods for syncing with page navigation in PageRouterOutlet
     public _beginBackPageNavigation() {
         routerLog("NSLocationStrategy.startGoBack()");
-        if (this._isPageNavigationgBack) {
+        if (this._isPageNavigationBack) {
             throw new Error("Calling startGoBack while going back.");
         }
-        this._isPageNavigationgBack = true;
+        this._isPageNavigationBack = true;
     }
 
     public _finishBackPageNavigation() {
         routerLog("NSLocationStrategy.finishBackPageNavigation()");
-        if (!this._isPageNavigationgBack) {
+        if (!this._isPageNavigationBack) {
             throw new Error("Calling endGoBack while not going back.");
         }
-        this._isPageNavigationgBack = false;
+        this._isPageNavigationBack = false;
     }
 
     public _isPageNavigatingBack() {
-        return this._isPageNavigationgBack;
+        return this._isPageNavigationBack;
     }
 
     public _beginPageNavigation(): NavigationOptions {
@@ -199,7 +199,7 @@ export class NSLocationStrategy extends LocationStrategy {
             `${JSON.stringify(this._currentNavigationOptions)})`);
     }
 
-    public _getSatates(): Array<LocationState> {
+    public _getStates(): Array<LocationState> {
         return this.states.slice();
     }
 }
diff --git a/ng-sample/app/examples/list/list-test-async.ts b/ng-sample/app/examples/list/list-test-async.ts
@@ -1,8 +1,8 @@
-import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
-import * as Rx from 'rxjs/Observable';
-import { combineLatest } from 'rxjs/operator/combineLatest';
+import { Component, ChangeDetectionStrategy } from '@angular/core';
+import { DataItem, DataService } from "./data.service";
+import { Observable } from "rxjs/Observable";
 import { BehaviorSubject } from "rxjs/BehaviorSubject";
-import { DataItem, DataService } from "./data.service"
+import "rxjs/add/operator/combineLatest";
 
 @Component({
     selector: 'list-test-async',
@@ -80,19 +80,18 @@ export class ListTestAsync {
 
         <StackLayout row="2" colSpan="2" orientation="horizontal">
             <button (tap)="toggleAsyncUpdates()" [text]="isUpdating ? 'stop updates' : 'start updates'"></button>
-            <button (tap)="toogleFilter()" [text]="(filter$ | async) ? 'show all' : 'show even'"></button>
+            <button (tap)="toggleFilter()" [text]="(filter$ | async) ? 'show all' : 'show even'"></button>
         </StackLayout>
     </GridLayout>
     `
 })
 export class ListTestFilterAsync {
     public isUpdating: boolean = false;
-    public filteredItems$: Rx.Observable<Array<DataItem>>;
+    public filteredItems$: Observable<Array<DataItem>>;
     private filter$ = new BehaviorSubject(false);
 
     constructor(private service: DataService) {
-        // Create filteredItems$ by combining the service.items$ and filter$
-        this.filteredItems$ = combineLatest(this.service.items$, this.filter$, (data, filter) => {
+        this.filteredItems$ = this.service.items$.combineLatest(this.filter$, (data, filter) => {
             return filter ? data.filter(v => v.id % 2 === 0) : data;
         });
     }
@@ -111,7 +110,7 @@ export class ListTestFilterAsync {
         this.isUpdating = !this.isUpdating;
     }
 
-    public toogleFilter() {
+    public toggleFilter() {
         this.filter$.next(!this.filter$.value);
     }
 }
diff --git a/ng-sample/app/examples/router/clear-history-test.ts b/ng-sample/app/examples/router/clear-history-test.ts
@@ -1,9 +1,8 @@
 import { Component, OnInit, OnDestroy, Injectable } from "@angular/core";
-import { ActivatedRoute, Router, CanDeactivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
-import { Observable } from "rxjs";
-import { RouterExtensions, PageRoute } from "nativescript-angular/router";
+import { Router } from '@angular/router';
+import { RouterExtensions } from "nativescript-angular/router";
 import { NSLocationStrategy } from "nativescript-angular/router/ns-location-strategy";
-import { BehaviorSubject} from "rxjs";
+import { BehaviorSubject } from "rxjs/BehaviorSubject";
 
 @Injectable()
 class LocationLogService {
@@ -15,7 +14,7 @@ class LocationLogService {
         router.events.subscribe((e) => {
             this.routerEvents$.next([...this.routerEvents$.getValue(), e.toString()]);
 
-            let states = this.strategy._getSatates()
+            let states = this.strategy._getStates()
                 .map((v, i) => {
                     return (i + "." + (v.isPageNavigation ? "[PAGE]" : "") + " \"" + v.url + "\"");
                 })

diff --git a/ng-sample/app/examples/router/login-test.ts b/ng-sample/app/examples/router/login-test.ts
@@ -1,11 +1,10 @@
-import { Component, OnInit, OnDestroy, Injectable } from "@angular/core";
-import { Router, CanActivate, Resolve, ActivatedRouteSnapshot, RouterStateSnapshot, ActivatedRoute, Params } from '@angular/router';
-import { Observable } from "rxjs";
+import { Component, Injectable } from "@angular/core";
+import { CanActivate, Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
 import { RouterExtensions, PageRoute } from "nativescript-angular/router";
-import { NSLocationStrategy } from "nativescript-angular/router/ns-location-strategy";
-import { BehaviorSubject } from "rxjs";
-import { Page } from "ui/page";
-import * as appSettings from "application-settings"
+import * as appSettings from "application-settings";
+import { Observable } from "rxjs/Observable";
+import "rxjs/add/operator/map";
+import "rxjs/add/operator/switchMap";
 
 const USER_KEY = "user";
 
@@ -160,7 +159,7 @@ class ResolveGuard implements Resolve<ResolvedData> {
     static counter = 0;
     resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<ResolvedData> | Promise<ResolvedData> | ResolvedData {
         const result: ResolvedData = { id: ResolveGuard.counter++ }
-        console.log(`ResolveGuard: Fteching new data. Result: ${JSON.stringify(result)} `);
+        console.log(`ResolveGuard: Fetching new data. Result: ${JSON.stringify(result)} `);
         return result;
     }
 }
@@ -175,17 +174,17 @@ export class LoginAppComponent {
         { path: "main", component: MainComponent, canActivate: [AuthGuard], resolve: [ResolveGuard] },
         { path: "inner", component: InnerComponent, canActivate: [AuthGuard] },
         { path: "login", component: LoginComponent },
-    ]
+    ];
 
     static entries = [
         LoginComponent,
         MainComponent,
         InnerComponent
-    ]
+    ];
 
     static providers = [
         AuthGuard,
         ResolveGuard,
         LoginService,
-    ]
+    ];
 }
diff --git a/ng-sample/app/examples/router/page-router-outlet-nested-test.ts b/ng-sample/app/examples/router/page-router-outlet-nested-test.ts
@@ -1,9 +1,9 @@
 import { Component, OnInit, OnDestroy } from "@angular/core";
-import { ActivatedRoute, Router, Event } from '@angular/router';
-import { Observable } from "rxjs";
-import { Location, LocationStrategy} from '@angular/common';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Location } from '@angular/common';
 import { Page } from "ui/page";
-
+import { Observable } from "rxjs/Observable";
+import 'rxjs/add/operator/map';
 
 @Component({
     selector: "first",

diff --git a/ng-sample/app/examples/router/page-router-outlet-test.ts b/ng-sample/app/examples/router/page-router-outlet-test.ts
@@ -1,8 +1,9 @@
 import { Component, OnInit, OnDestroy } from "@angular/core";
 import { ActivatedRoute, Router } from '@angular/router';
-import { Observable } from "rxjs";
 import { Location } from '@angular/common';
 import { Page } from "ui/page";
+import { Observable } from "rxjs/Observable";
+import 'rxjs/add/operator/map';
 
 
 @Component({

diff --git a/ng-sample/app/examples/router/router-outlet-test.ts b/ng-sample/app/examples/router/router-outlet-test.ts
@@ -1,5 +1,6 @@
 import { Component, OnInit, OnDestroy } from "@angular/core";
 import { ActivatedRoute } from '@angular/router';
+import "rxjs/add/operator/map";
 
 @Component({
     selector: "first",

diff --git a/ng-sample/package.json b/ng-sample/package.json
@@ -23,20 +23,20 @@
   },
   "homepage": "https://github.com/NativeScript/template-hello-world",
   "dependencies": {
-    "tns-core-modules": "2.4.0",
+    "tns-core-modules": "~2.4.0",
     "nativescript-angular": "file:../nativescript-angular",
-    "@angular/core": "~2.2.1",
-    "@angular/common": "~2.2.1",
-    "@angular/compiler": "~2.2.1",
-    "@angular/forms": "~2.2.1",
-    "@angular/http": "~2.2.1",
-    "@angular/platform-browser": "~2.2.1",
-    "@angular/platform-browser-dynamic": "~2.2.1",
-    "@angular/router": "~3.2.1",
-    "rxjs": "5.0.0-beta.12"
+    "@angular/core": "~2.3.1",
+    "@angular/common": "~2.3.1",
+    "@angular/compiler": "~2.3.1",
+    "@angular/http": "~2.3.1",
+    "@angular/platform-browser": "~2.3.1",
+    "@angular/platform-browser-dynamic": "~2.3.1",
+    "@angular/forms": "~2.3.1",
+    "@angular/router": "~3.3.1",
+    "rxjs": "5.0.0-rc.4"
   },
   "devDependencies": {
-    "zone.js": "~0.6.21",
+    "zone.js": "~0.7.2",
     "babel-traverse": "6.9.0",
     "babel-types": "6.10.0",
     "babylon": "6.8.1",

diff --git a/tests/app/base.component.ts b/tests/app/base.component.ts
@@ -1,6 +1,6 @@
-import {Component, OpaqueToken, OnInit, OnDestroy} from "@angular/core";
+import { OpaqueToken, OnInit, OnDestroy } from "@angular/core";
 export const HOOKS_LOG = new OpaqueToken("Hooks log");
-import {BehaviorSubject} from "rxjs";
+import { BehaviorSubject } from "rxjs/BehaviorSubject";
 
 export class BaseComponent implements OnInit, OnDestroy {
     protected name: string = "";

diff --git a/tests/app/first.component.ts b/tests/app/first.component.ts
@@ -1,7 +1,7 @@
 import { Router, ActivatedRoute } from '@angular/router';
 import { Component, Inject } from "@angular/core";
 import { HOOKS_LOG, BaseComponent } from "./base.component";
-import { BehaviorSubject } from "rxjs";
+import { BehaviorSubject } from "rxjs/BehaviorSubject";
 
 @Component({
     selector: "first-comp",

diff --git a/tests/app/main.ts b/tests/app/main.ts
@@ -26,7 +26,7 @@ import { NavigationApp } from "./snippets/navigation/router-outlet";
 
 import { rendererTraceCategory, routerTraceCategory } from "nativescript-angular/trace";
 
-import { BehaviorSubject } from "rxjs";
+import { BehaviorSubject } from "rxjs/BehaviorSubject";
 
 import trace = require("trace");
 // trace.setCategories(rendererTraceCategory + "," + routerTraceCategory);

diff --git a/tests/app/second.component.ts b/tests/app/second.component.ts
@@ -1,8 +1,8 @@
-import {Router, ActivatedRoute } from '@angular/router';
-import {Component, Inject} from "@angular/core";
-import {Location} from "@angular/common";
-import {HOOKS_LOG, BaseComponent} from "./base.component";
-import {BehaviorSubject} from "rxjs";
+import { Router, ActivatedRoute } from "@angular/router";
+import { Component, Inject } from "@angular/core";
+import { Location } from "@angular/common";
+import { HOOKS_LOG, BaseComponent } from "./base.component";
+import { BehaviorSubject } from "rxjs/BehaviorSubject";
 
 @Component({
     selector: "second-comp",
@@ -17,7 +17,7 @@ import {BehaviorSubject} from "rxjs";
 })
 export class SecondComponent extends BaseComponent {
     protected name = "second";
-    public id: string = ""
+    public id: string = "";
 
     constructor(private router: Router, private location: Location, private routeData: ActivatedRoute, @Inject(HOOKS_LOG) hooksLog: BehaviorSubject<Array<string>>) {
         super(hooksLog);

diff --git a/tests/app/snippets/navigation/route-params.ts b/tests/app/snippets/navigation/route-params.ts
@@ -12,6 +12,8 @@ class MyComponent {
 
 // >> router-params-page-route
 import { PageRoute } from "nativescript-angular/router";
+import "rxjs/add/operator/switchMap";
+
 class MyPageComponent {
   id: number;
   constructor(private pageRoute: PageRoute) {