Update to 2.2.0

nativescript-angular/animation-driver.ts

@@ -1,4 +1,5 @@
-import { AnimationPlayer, AnimationStyles, AnimationKeyframe } from "./private_import_core";
+import { AnimationPlayer } from "@angular/core";
+import { AnimationStyles, AnimationKeyframe } from "./private_import_core";
 import { NativeScriptAnimationPlayer } from './animation-player';
 import { View } from "ui/core/view";
 import { getPropertyByCssName } from 'ui/styling/style-property';

nativescript-angular/animation-player.ts

@@ -1,4 +1,5 @@
-import { AnimationPlayer, AnimationKeyframe } from "./private_import_core";
+import { AnimationPlayer } from "@angular/core";
+import { AnimationKeyframe } from "./private_import_core";
 import { KeyframeAnimation, KeyframeAnimationInfo, KeyframeInfo, KeyframeDeclaration } from 'ui/animation/keyframe-animation';
 import { View } from "ui/core/view";
 import { AnimationCurve } from "ui/enums";

nativescript-angular/dom-adapter.ts

@@ -16,60 +16,69 @@ export enum SecurityContext {
 
 export class NativeScriptElementSchemaRegistry extends ElementSchemaRegistry {
   hasProperty(tagName: string, propName: string): boolean {
-      return true;
+    return true;
   }
 
   hasElement(tagName: string, schemaMetas: SchemaMetadata[]): boolean {
-      return true;
+    return true;
   }
 
 
   getMappedPropName(propName: string): string {
-      return propName;
+    return propName;
   }
 
   getDefaultComponentElementName(): string {
-      return 'ng-component';
+    return 'ng-component';
   }
 
   securityContext(tagName: string, propName: string): any {
-      return SecurityContext.NONE;
+    return SecurityContext.NONE;
   }
 
-  validateProperty(name: string): {error: boolean, msg?: string} {
-      return {error: false};
+  validateProperty(name: string): { error: boolean, msg?: string } {
+    return { error: false };
   }
 
-  validateAttribute(name: string): {error: boolean, msg?: string} {
-      return {error: false};
+  validateAttribute(name: string): { error: boolean, msg?: string } {
+    return { error: false };
   }
 
   allKnownElementNames(): string[] {
-      return [];
+    return [];
+  }
+
+  normalizeAnimationStyleProperty(propName: string): string {
+    return propName;
+  }
+
+  normalizeAnimationStyleValue(camelCaseProp: string, userProvidedProp: string, val: string | number):
+    { error: string, value: string } {
+    return { error: null, value: val.toString() };
   }
 }
 
 export class NativeScriptDomAdapter extends Parse5DomAdapter {
   static makeCurrent() {
-      rendererLog("Setting DOM");
-      setRootDomAdapter(new NativeScriptDomAdapter());
+    rendererLog("Setting DOM");
+    setRootDomAdapter(new NativeScriptDomAdapter());
   }
 
   hasProperty(element, name: string) {
-      //TODO: actually check if the property exists.
-      return true;
+    //TODO: actually check if the property exists.
+    return true;
   }
 
   log(arg: any): void {
-      print(arg);
+    print(arg);
   }
 
   logError(arg: any): void {
-      print(arg);
+    print(arg);
   }
 
   logGroup(arg: any): void {
-      print(arg);
+    print(arg);
   }
 
   logGroupEnd(): void {

nativescript-angular/package.json

@@ -21,14 +21,14 @@
   },
   "dependencies": {
     "nativescript-intl": "~0.0.4",
-    "@angular/core": "~2.1.1",
-    "@angular/common": "~2.1.1",
-    "@angular/compiler": "~2.1.1",
-    "@angular/http": "~2.1.1",
-    "@angular/platform-browser": "~2.1.1",
-    "@angular/platform-browser-dynamic": "~2.1.1",
-    "@angular/forms": "~2.1.1",
-    "@angular/router": "~3.1.1",
+    "@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",
     "reflect-metadata": "~0.1.8",
     "parse5": "1.3.2",
@@ -37,10 +37,10 @@
     "url": "0.10.3"
   },
   "devDependencies": {
-    "tns-core-modules": ">=2.2.0 || >=2.2.0-2016",
+    "tns-core-modules": ">=2.4.0 || >=2.4.0-2016",
     "zone.js": "^0.6.21",
     "typescript": "^2.0.2",
-    "@angular/compiler-cli": "~2.1.1"
+    "@angular/compiler-cli": "~2.2.1"
   },
   "nativescript": {}
 }

nativescript-angular/renderer.ts

@@ -2,7 +2,8 @@ import {
     Inject, Injectable, Optional, NgZone,
     Renderer, RootRenderer, RenderComponentType,
 } from '@angular/core';
-import { AnimationPlayer, AnimationStyles, AnimationKeyframe  } from "./private_import_core";
+import { AnimationPlayer } from "@angular/core";
+import { AnimationStyles, AnimationKeyframe } from "./private_import_core";
 import {APP_ROOT_VIEW, DEVICE} from "./platform-providers";
 import {isBlank} from "./lang-facade";
 import {View} from "ui/core/view";

nativescript-angular/router/page-router-outlet.ts

@@ -60,14 +60,17 @@ class RefCache {
 export class PageRouterOutlet {
     private viewUtil: ViewUtil;
     private refCache: RefCache = new RefCache();
-    private isInitalPage: boolean = true;
+    private isInitialPage: boolean = true;
     private detachedLoaderFactory: ComponentFactory<DetachedLoader>;
 
     private currentActivatedComp: ComponentRef<any>;
     private currentActivatedRoute: ActivatedRoute;
 
     public outletMap: RouterOutletMap;
 
+    get locationInjector(): Injector { return this.containerRef.injector; }
+    get locationFactoryResolver(): ComponentFactoryResolver { return this.resolver; }
+
     get isActivated(): boolean {
         return !!this.currentActivatedComp;
     }
@@ -93,7 +96,7 @@ export class PageRouterOutlet {
         @Attribute('name') name: string,
         private locationStrategy: NSLocationStrategy,
         private componentFactoryResolver: ComponentFactoryResolver,
-        resolver: ComponentFactoryResolver,
+        private resolver: ComponentFactoryResolver,
         private frame: Frame,
         @Inject(DEVICE) device: Device,
         @Inject(PAGE_FACTORY) private pageFactory: PageFactory) {
@@ -143,33 +146,33 @@ export class PageRouterOutlet {
      * This method in turn is responsible for calling the `routerOnActivate` hook of its child.
      */
     activate(
-        activatedRoute: ActivatedRoute, loadedResolver: ComponentFactoryResolver,
-        loadedInjector: Injector, providers: ResolvedReflectiveProvider[],
-        outletMap: RouterOutletMap): void {
+        activatedRoute: ActivatedRoute, resolver: ComponentFactoryResolver, injector: Injector,
+        providers: ResolvedReflectiveProvider[], outletMap: RouterOutletMap): void {
         this.outletMap = outletMap;
         this.currentActivatedRoute = activatedRoute;
 
         if (this.locationStrategy._isPageNavigatingBack()) {
             this.activateOnGoBack(activatedRoute, providers, outletMap);
         } else {
-            this.activateOnGoForward(activatedRoute, providers, outletMap, loadedResolver);
+            this.activateOnGoForward(activatedRoute, providers, outletMap, resolver, injector);
         }
     }
 
     private activateOnGoForward(
         activatedRoute: ActivatedRoute,
         providers: ResolvedReflectiveProvider[],
         outletMap: RouterOutletMap,
-        loadedResolver: ComponentFactoryResolver): void {
+        loadedResolver: ComponentFactoryResolver,
+        injector: Injector): void {
         const factory = this.getComponentFactory(activatedRoute, loadedResolver);
 
         const pageRoute = new PageRoute(activatedRoute);
         providers = [...providers, ...ReflectiveInjector.resolve([{ provide: PageRoute, useValue: pageRoute }])];
 
-        if (this.isInitalPage) {
-            log("PageRouterOutlet.activate() inital page - just load component");
-            this.isInitalPage = false;
-            const inj = ReflectiveInjector.fromResolvedProviders(providers, this.containerRef.parentInjector);
+        if (this.isInitialPage) {
+            log("PageRouterOutlet.activate() initial page - just load component");
+            this.isInitialPage = false;
+            const inj = ReflectiveInjector.fromResolvedProviders(providers, injector);
             this.currentActivatedComp = this.containerRef.createComponent(factory, this.containerRef.length, inj, []);
             this.refCache.push(this.currentActivatedComp, pageRoute, outletMap, null);
 
@@ -180,7 +183,7 @@ export class PageRouterOutlet {
             const pageResolvedProvider = ReflectiveInjector.resolve([
                 { provide: Page, useValue: page }
             ]);
-            const childInjector = ReflectiveInjector.fromResolvedProviders([...providers, ...pageResolvedProvider], this.containerRef.parentInjector);
+            const childInjector = ReflectiveInjector.fromResolvedProviders([...providers, ...pageResolvedProvider], injector);
             const loaderRef = this.containerRef.createComponent(this.detachedLoaderFactory, this.containerRef.length, childInjector, []);
 
             this.currentActivatedComp = loaderRef.instance.loadWithFactory(factory);
@@ -193,7 +196,7 @@ export class PageRouterOutlet {
         activatedRoute: ActivatedRoute,
         providers: ResolvedReflectiveProvider[],
         outletMap: RouterOutletMap): void {
-        log("PageRouterOutlet.activate() - Back naviation, so load from cache");
+        log("PageRouterOutlet.activate() - Back navigation, so load from cache");
 
         this.locationStrategy._finishBackPageNavigation();
 

ng-sample/app/app.ts

@@ -6,7 +6,8 @@
 //profiling.start('application-start');
 
 // "nativescript-angular/application" import should be first in order to load some required settings (like globals and reflect-metadata)
-import { NativeScriptModule, platformNativeScriptDynamic, onAfterLivesync, onBeforeLivesync } from "nativescript-angular/platform";
+import { NativeScriptModule, platformNativeScriptDynamic } from "nativescript-angular/platform";
+import { onAfterLivesync, onBeforeLivesync } from "nativescript-angular/platform-common";
 import { NgModule } from "@angular/core";
 import { Router } from "@angular/router";
 import { NativeScriptRouterModule } from "nativescript-angular/router";

ng-sample/package.json

@@ -23,17 +23,17 @@
   },
   "homepage": "https://github.com/NativeScript/template-hello-world",
   "dependencies": {
-    "tns-core-modules": "2.3.0",
+    "tns-core-modules": "2.4.0",
     "nativescript-angular": "file:../nativescript-angular",
     "nativescript-intl": "^0.0.4",
-    "@angular/core": "~2.1.1",
-    "@angular/common": "~2.1.1",
-    "@angular/compiler": "~2.1.1",
-    "@angular/forms": "~2.1.1",
-    "@angular/http": "~2.1.1",
-    "@angular/platform-browser": "~2.1.1",
-    "@angular/platform-browser-dynamic": "~2.1.1",
-    "@angular/router": "~3.1.0",
+    "@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"
   },
   "devDependencies": {
@@ -51,10 +51,10 @@
   "nativescript": {
     "id": "org.nativescript.ngsample",
     "tns-android": {
-      "version": "2.3.0"
+      "version": "2.4.0"
     },
     "tns-ios": {
-      "version": "2.3.0"
+      "version": "2.4.0"
     }
   }
 }

tests/app/tests/platform-filter-components.ts

@@ -1,11 +1,10 @@
 //make sure you import mocha-config before @angular/core
-import {assert} from "./test-config";
-import {Component, ElementRef} from "@angular/core";
-import {ProxyViewContainer} from "ui/proxy-view-container";
-import {dumpView, createDevice} from "./test-utils";
-import {TestApp} from "./test-app";
-import {DEVICE} from "nativescript-angular/platform-providers";
-import {platformNames} from "platform";
+import { assert } from "./test-config";
+import { Component, ElementRef } from "@angular/core";
+import { dumpView, createDevice } from "./test-utils";
+import { TestApp } from "./test-app";
+import { DEVICE } from "nativescript-angular/platform-providers";
+import { platformNames } from "platform";
 
 @Component({
     template: `
@@ -37,12 +36,12 @@ export class PlatformSpecificAttributeComponent {
     constructor(public elementRef: ElementRef) { }
 }
 
-describe('Platofrm filter directives', () => {
+describe('Platform filter directives', () => {
     describe('on IOS device', () => {
         let testApp: TestApp = null;
 
         before(() => {
-            return TestApp.create([{provide: DEVICE, useValue: createDevice(platformNames.ios)}], [PlatformSpecificAttributeComponent, AndroidSpecificComponent, IosSpecificComponent]).then((app) => {
+            return TestApp.create([{ provide: DEVICE, useValue: createDevice(platformNames.ios) }], [PlatformSpecificAttributeComponent, AndroidSpecificComponent, IosSpecificComponent]).then((app) => {
                 testApp = app;
             });
         });
@@ -51,21 +50,17 @@ describe('Platofrm filter directives', () => {
             testApp.dispose();
         });
 
-        it("does render ios sepecific conternt", () => {
+        it("does render ios specific content", () => {
             return testApp.loadComponent(IosSpecificComponent).then((componentRef) => {
                 const componentRoot = componentRef.instance.elementRef.nativeElement;
-                assert.equal(
-                    "(ProxyViewContainer (StackLayout (ProxyViewContainer (template), (Label[text=IOS]))))",
-                    dumpView(componentRoot, true));
+                assert.isTrue(dumpView(componentRoot, true).indexOf("(Label[text=IOS])") >= 0);
             });
         });
 
-        it("does not render android sepecific conternt", () => {
+        it("does not render android specific content", () => {
             return testApp.loadComponent(AndroidSpecificComponent).then((componentRef) => {
                 const componentRoot = componentRef.instance.elementRef.nativeElement;
-                assert.equal(
-                    "(ProxyViewContainer (StackLayout (ProxyViewContainer (template))))",
-                    dumpView(componentRoot, true));
+                assert.isTrue(dumpView(componentRoot, true).indexOf("Label") < 0);
             });
         });
 
@@ -84,7 +79,7 @@ describe('Platofrm filter directives', () => {
         let testApp: TestApp = null;
 
         before(() => {
-            return TestApp.create([{provide: DEVICE, useValue: createDevice(platformNames.android)}], [AndroidSpecificComponent, IosSpecificComponent, PlatformSpecificAttributeComponent]).then((app) => {
+            return TestApp.create([{ provide: DEVICE, useValue: createDevice(platformNames.android) }], [AndroidSpecificComponent, IosSpecificComponent, PlatformSpecificAttributeComponent]).then((app) => {
                 testApp = app;
             });
         });
@@ -93,21 +88,17 @@ describe('Platofrm filter directives', () => {
             testApp.dispose();
         });
 
-        it("does render android sepecific conternt", () => {
+        it("does render android specific content", () => {
             return testApp.loadComponent(AndroidSpecificComponent).then((componentRef) => {
                 const componentRoot = componentRef.instance.elementRef.nativeElement;
-                assert.equal(
-                    "(ProxyViewContainer (StackLayout (ProxyViewContainer (template), (Label[text=ANDROID]))))",
-                    dumpView(componentRoot, true));
+                assert.isTrue(dumpView(componentRoot, true).indexOf("(Label[text=ANDROID])") >= 0);
             });
         });
 
-        it("does not render ios sepecific conternt", () => {
+        it("does not render ios specific content", () => {
             return testApp.loadComponent(IosSpecificComponent).then((componentRef) => {
                 const componentRoot = componentRef.instance.elementRef.nativeElement;
-                assert.equal(
-                    "(ProxyViewContainer (StackLayout (ProxyViewContainer (template))))",
-                    dumpView(componentRoot, true));
+                assert.isTrue(dumpView(componentRoot, true).indexOf("Label") < 0);
             });
         });