Upgrade to Angular RC0

.travis.yml

@@ -1,5 +1,8 @@
 language: android
 
+jdk:
+    - oraclejdk8
+
 android:
   components:
     - platform-tools

ng-sample/app/examples/action-bar/action-bar-test.ts

@@ -1,5 +1,5 @@
-import {Component} from 'angular2/core';
-import {RouteConfig} from 'angular2/router';
+import {Component} from '@angular/core';
+import {RouteConfig} from '@angular/router';
 import { Page} from "ui/page";
 import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "../../nativescript-angular/router/ns-router";
 import {NS_DIRECTIVES} from "../../nativescript-angular/directives";

ng-sample/app/examples/image/image-test.ts

@@ -1,4 +1,4 @@
-import {Component} from 'angular2/core';
+import {Component} from '@angular/core';
 
 /* IMPORTANT
 In order to test out the full image example, to fix the App Transport Security error in iOS 9, you will need to follow this after adding the iOS platform:

ng-sample/app/examples/list/list-test-async.ts

@@ -1,4 +1,4 @@
-import { Component, Input, ChangeDetectionStrategy } from 'angular2/core';
+import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
 import { Observable as RxObservable } from 'rxjs/Observable';
 
 export class DataItem {
@@ -55,4 +55,4 @@ export class ListTestAsync {
     public onItemTap(args) {
         console.log("------------------------ ItemTapped: " + args.index);
     }
-}
+}

ng-sample/app/examples/list/list-test.ts

@@ -1,4 +1,4 @@
-import {Component, Input, WrappedValue, ChangeDetectionStrategy} from 'angular2/core';
+import {Component, Input, WrappedValue, ChangeDetectionStrategy} from '@angular/core';
 import {Label} from 'ui/label';
 import {ObservableArray} from 'data/observable-array';
 

ng-sample/app/examples/modal/modal-content.ts

@@ -1,4 +1,4 @@
-import {Component} from 'angular2/core';
+import {Component} from '@angular/core';
 import {ModalDialogParams} from "../../nativescript-angular/directives/dialogs";
 
 @Component({
@@ -32,4 +32,4 @@ export class ModalContent {
     ngOnDestroy() {
         console.log("ModalContent.ngOnDestroy");
     }
-}
+}

ng-sample/app/examples/modal/modal-test.ts

@@ -1,4 +1,4 @@
-import {Component} from 'angular2/core';
+import {Component} from '@angular/core';
 import * as dialogs from "ui/dialogs";
 import {ModalDialogService, ModalDialogOptions, ModalDialogHost} from "../../nativescript-angular/directives/dialogs";
 import {ModalContent} from "./modal-content";

ng-sample/app/examples/navigation/nav-component.ts

@@ -1,7 +1,7 @@
-import {Component} from 'angular2/core';
+import {Component} from '@angular/core';
 import {ROUTER_DIRECTIVES, Router, OnActivate, OnDeactivate, CanReuse, OnReuse,
- RouteParams, ComponentInstruction, RouteConfig } from 'angular2/router';
-import {Location, LocationStrategy} from 'angular2/platform/common';
+ RouteParams, ComponentInstruction, RouteConfig } from '@angular/router';
+import {Location, LocationStrategy} from '@angular/common';
 import {topmost} from "ui/frame";
 import {Page} from "ui/page";
 import {NS_ROUTER_DIRECTIVES} from "../../nativescript-angular/router/ns-router";
@@ -134,4 +134,4 @@ export class NavComponent implements OnActivate, OnDeactivate {
     routerOnReuse(nextInstruction: ComponentInstruction, prevInstruction: ComponentInstruction): any {
         console.log("NavComponent.routerOnReuse() componentID: " + this.compId);
     }
-}
+}

ng-sample/app/examples/navigation/navigation-test.ts

@@ -1,5 +1,5 @@
-import {Component} from 'angular2/core';
-import {RouteConfig, ROUTER_PROVIDERS, ROUTER_DIRECTIVES, ComponentInstruction} from 'angular2/router';
+import {Component} from '@angular/core';
+import {RouteConfig, ROUTER_PROVIDERS, ROUTER_DIRECTIVES, ComponentInstruction} from '@angular/router';
 
 import {NavComponent} from "./nav-component";
 import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "../../nativescript-angular/router/ns-router";

ng-sample/app/examples/navigation/router-outlet-test.ts

@@ -1,5 +1,5 @@
-import {Component} from 'angular2/core';
-import {RouteConfig, ROUTER_PROVIDERS, ROUTER_DIRECTIVES, ComponentInstruction, RouteParams} from 'angular2/router';
+import {Component} from '@angular/core';
+import {RouteConfig, ROUTER_PROVIDERS, ROUTER_DIRECTIVES, ComponentInstruction, RouteParams} from '@angular/router';
 import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "../../nativescript-angular/router/ns-router";
 
 @Component({
@@ -50,4 +50,4 @@ class SecondComponent {
     { path: '/first', component: FirstComponent, name: 'First', useAsDefault: true },
     { path: '/second/:id', component: SecondComponent, name: 'Second' },
 ])
-export class RouterOutletTest { }
+export class RouterOutletTest { }

ng-sample/app/examples/platform-directives/platform-directives-test.ts

@@ -1,4 +1,4 @@
-import {Component} from 'angular2/core';
+import {Component} from '@angular/core';
 
 @Component({
     selector: 'action-bar-test',

ng-sample/app/examples/renderer-test.ts

@@ -1,4 +1,4 @@
-import {Component, Directive, Host, ElementRef, Input} from 'angular2/core';
+import {Component, Directive, Host, ElementRef, Input} from '@angular/core';
 import {Observable} from 'data/observable';
 import {TextValueAccessor} from '../nativescript-angular/value-accessors/text-value-accessor';
 import {CheckedValueAccessor} from '../nativescript-angular/value-accessors/checked-value-accessor';

ng-sample/app/performance/benchmark.ts

@@ -1,8 +1,7 @@
 import {StackLayout} from 'ui/layouts/stack-layout';
 import {Button} from 'ui/button';
 import {Label} from 'ui/label';
-import {Inject, Component} from 'angular2/core';
-import {ApplicationRef} from 'angular2/src/core/application_ref';
+import {Inject, Component, ApplicationRef} from '@angular/core';
 import * as profiling from './profiling';
 
 @Component({

ng-sample/package.json

@@ -23,17 +23,22 @@
 	},
 	"homepage": "https://github.com/NativeScript/template-hello-world",
 	"dependencies": {
-		"tns-core-modules": "^2.0.0-angular-4",
+		"tns-core-modules": "^2.0.0",
 		"nativescript-intl": "^0.0.2",
-		"angular2": "2.0.0-beta.16",
-		"es6-shim": "^0.35.0",
+		"@angular/common": "0.0.0-0",
+		"@angular/compiler": "0.0.0-0",
+		"@angular/core": "0.0.0-0",
+		"@angular/router": "0.0.0-0",
+		"@angular/platform-browser": "0.0.0-0",
+		"@angular/platform-browser-dynamic": "0.0.0-0",
+		"@angular/platform-server": "0.0.0-0",
+		"reflect-metadata": "^0.1.3",
+		"rxjs": "5.0.0-beta.2",
+		"zone.js": "^0.6.12",
 		"parse5": "1.4.2",
 		"punycode": "1.3.2",
 		"querystring": "0.2.0",
-		"url": "0.10.3",
-		"reflect-metadata": "0.1.2",
-		"rxjs": "5.0.0-beta.2",
-		"zone.js": "^0.6.12"
+		"url": "0.10.3"
 	},
 	"devDependencies": {
 		"babel-traverse": "6.7.6",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nativescript-angular",
-  "version": "0.0.46",
+  "version": "0.1.0",
   "description": "",
   "homepage": "http://www.telerik.com",
   "bugs": "http://www.telerik.com",
@@ -16,15 +16,20 @@
   "dependencies": {
     "tns-core-modules": "^2.0.0",
     "nativescript-intl": "^0.0.2",
-    "angular2": "2.0.0-beta.16",
-    "es6-shim": "^0.35.0",
+    "@angular/common": "0.0.0-0",
+    "@angular/compiler": "0.0.0-0",
+    "@angular/core": "0.0.0-0",
+    "@angular/router": "0.0.0-0",
+    "@angular/platform-browser": "0.0.0-0",
+    "@angular/platform-browser-dynamic": "0.0.0-0",
+    "@angular/platform-server": "0.0.0-0",
+    "reflect-metadata": "^0.1.3",
+    "rxjs": "5.0.0-beta.2",
+    "zone.js": "^0.6.12",
     "parse5": "1.4.2",
     "punycode": "1.3.2",
     "querystring": "0.2.0",
-    "url": "0.10.3",
-    "reflect-metadata": "0.1.2",
-    "rxjs": "5.0.0-beta.2",
-    "zone.js": "^0.6.12"
+    "url": "0.10.3"
   },
   "devDependencies": {
     "grunt": "0.4.5",

src/nativescript-angular/application.ts

@@ -1,28 +1,26 @@
 import 'globals';
+global.window = global;
 import "zone.js/dist/zone-node"
 
 import 'reflect-metadata';
 import './polyfills/array';
-import {isPresent, Type} from 'angular2/src/facade/lang';
+import {isPresent, Type, print} from '@angular/core/src/facade/lang';
 import {ReflectiveInjector, reflector, coreLoadAndBootstrap, createPlatform, 
-        getPlatform, assertPlatform, ComponentRef, PlatformRef, PLATFORM_DIRECTIVES, PLATFORM_PIPES} from 'angular2/core';
-import {bind, provide, Provider} from 'angular2/src/core/di';
-import {DOM} from 'angular2/src/platform/dom/dom_adapter';
+        getPlatform, assertPlatform, ComponentRef, PlatformRef, PLATFORM_DIRECTIVES, PLATFORM_PIPES} from '@angular/core';
+import {bind, provide, Provider} from '@angular/core/src/di';
 
-import {RootRenderer, Renderer} from 'angular2/src/core/render/api';
+import {RootRenderer, Renderer} from '@angular/core/src/render/api';
 import {NativeScriptRootRenderer, NativeScriptRenderer} from './renderer';
-import {NativeScriptDomAdapter} from './dom_adapter';
-import {XHR} from 'angular2/src/compiler/xhr';
+import {NativeScriptDomAdapter, NativeScriptElementSchemaRegistry} from './dom_adapter';
+import {ElementSchemaRegistry, XHR, COMPILER_PROVIDERS} from '@angular/compiler';
 import {FileSystemXHR} from './xhr';
-import {Parse5DomAdapter} from 'angular2/src/platform/server/parse5_adapter';
-import {ExceptionHandler} from 'angular2/src/facade/exception_handler';
-import {APPLICATION_COMMON_PROVIDERS} from 'angular2/src/core/application_common_providers';
-import {COMPILER_PROVIDERS} from 'angular2/src/compiler/compiler';
-import {PLATFORM_COMMON_PROVIDERS} from 'angular2/src/core/platform_common_providers';
-import {COMMON_DIRECTIVES, COMMON_PIPES, FORM_PROVIDERS} from "angular2/common";
+import {Parse5DomAdapter} from '@angular/platform-server/src/parse5_adapter';
+import {ExceptionHandler} from '@angular/core/src/facade/exception_handler';
+import {APPLICATION_COMMON_PROVIDERS} from '@angular/core/src/application_common_providers';
+import {PLATFORM_COMMON_PROVIDERS} from '@angular/core/src/platform_common_providers';
+import {COMMON_DIRECTIVES, COMMON_PIPES, FORM_PROVIDERS} from "@angular/common";
 import {NS_DIRECTIVES} from './directives';
-import {ReflectionCapabilities} from 'angular2/src/core/reflection/reflection_capabilities';
-import {bootstrap as angularBootstrap} from 'angular2/platform/browser';
+import {ReflectionCapabilities} from '@angular/core/src/reflection/reflection_capabilities';
 
 import {Page} from 'ui/page';
 import {TextView} from 'ui/text-view';
@@ -40,6 +38,13 @@ export interface AppOptions {
     startPageActionBarHidden?: boolean;
 }
 
+class ConsoleLogger {
+  log = print;
+  logError = print;
+  logGroup = print;
+  logGroupEnd() {}
+}
+
 export function bootstrap(appComponentType: any,
     customProviders: ProviderArray = null): Promise<ComponentRef> {
     NativeScriptDomAdapter.makeCurrent();
@@ -54,15 +59,19 @@ export function bootstrap(appComponentType: any,
         provide(PLATFORM_PIPES, { useValue: COMMON_PIPES, multi: true }),
         provide(PLATFORM_DIRECTIVES, { useValue: COMMON_DIRECTIVES, multi: true }),
         provide(PLATFORM_DIRECTIVES, { useValue: NS_DIRECTIVES, multi: true }),
-        provide(ExceptionHandler, { useFactory: () => new ExceptionHandler(DOM, true), deps: [] }),
+        provide(ExceptionHandler, { useFactory: () => {
+            return new ExceptionHandler(new ConsoleLogger(), true)
+        }, deps: [] }),
 
         defaultPageProvider,
         defaultDeviceProvider,
         NativeScriptRootRenderer,
         provide(RootRenderer, { useClass: NativeScriptRootRenderer }),
         NativeScriptRenderer,
         provide(Renderer, { useClass: NativeScriptRenderer }),
+        provide(ElementSchemaRegistry, { useClass: NativeScriptElementSchemaRegistry }),
         COMPILER_PROVIDERS,
+        provide(ElementSchemaRegistry, { useClass: NativeScriptElementSchemaRegistry }),
         provide(XHR, { useClass: FileSystemXHR }),
     ]
 

src/nativescript-angular/common/detached-loader.ts

@@ -1,4 +1,9 @@
-import {DynamicComponentLoader, ComponentRef, ViewContainerRef, Component, Type, ViewChild} from 'angular2/core';
+import {DynamicComponentLoader, ComponentRef, ViewContainerRef, Component, Type, ViewChild} from '@angular/core';
+
+interface PendingLoadEntry {
+    componentType: Type;
+    resolveCallback: (ComponentRef) => void;
+}
 
 /**
  * Wrapper component used for loading components when navigating
@@ -9,14 +14,42 @@ import {DynamicComponentLoader, ComponentRef, ViewContainerRef, Component, Type,
     template: `<Placeholder #loader></Placeholder>`
 })
 export class DetachedLoader {
-
+    @ViewChild('loader', { read: ViewContainerRef }) containerRef: ViewContainerRef;
+    private viewLoaded = false;
+
+    private pendingLoads: PendingLoadEntry[] = [];
+
     constructor(
-        private containerRef: ViewContainerRef,
         private loader: DynamicComponentLoader
     ) {
     }
 
-    public loadComponent(componentType: Type): Promise<ComponentRef> {
+    public ngAfterViewInit() {
+        this.viewLoaded = true;
+
+        this.pendingLoads.forEach(loadEntry => {
+            this.loadInLocation(loadEntry.componentType).then(loadedRef => {
+                loadEntry.resolveCallback(loadedRef);
+            });
+        });
+    }
+
+    private loadInLocation(componentType: Type): Promise<ComponentRef> {
         return this.loader.loadNextToLocation(componentType, this.containerRef);
     }
-}
+
+    public loadComponent(componentType: Type): Promise<ComponentRef> {
+        // Check if called before placeholder is initialized.
+        // Delay load if so.
+        if (this.viewLoaded) {
+            return this.loadInLocation(componentType);
+        } else {
+            return new Promise((resolve, reject) => {
+                this.pendingLoads.push({
+                    componentType: componentType,
+                    resolveCallback: resolve
+                });
+            });
+        }
+    }
+}

src/nativescript-angular/directives.ts

@@ -1,4 +1,4 @@
-import {Type} from 'angular2/src/facade/lang';
+import {Type} from '@angular/core/src/facade/lang';
 import {ListViewComponent, SetupItemViewArgs} from './directives/list-view-comp';
 import {TextValueAccessor} from './value-accessors/text-value-accessor';
 import {CheckedValueAccessor} from './value-accessors/checked-value-accessor';
@@ -37,4 +37,4 @@ export {NumberValueAccessor} from './value-accessors/number-value-accessor';
 export {SelectedIndexValueAccessor} from './value-accessors/selectedIndex-value-accessor';
 export {TabViewDirective, TabViewItemDirective} from './directives/tab-view';
 export {ActionBarComponent, ActionBarScope, ActionItemDirective, NavigationButtonDirective} from './directives/action-bar';
-export {AndroidFilterComponent, IosFilterComponent} from './directives/platform-filters';
+export {AndroidFilterComponent, IosFilterComponent} from './directives/platform-filters';

src/nativescript-angular/directives/action-bar.ts

@@ -1,6 +1,6 @@
-import {Directive, Component, ContentChildren, ElementRef, Optional} from 'angular2/core';
+import {Directive, Component, ContentChildren, ElementRef, Optional} from '@angular/core';
 import {ActionItem, ActionBar, NavigationButton} from "ui/action-bar";
-import {isBlank} from "angular2/src/facade/lang";
+import {isBlank} from "@angular/core/src/facade/lang";
 import {Page} from "ui/page";
 import {View} from 'ui/core/view';
 import {registerElement, ViewClassMeta, NgView } from '../element-registry';

src/nativescript-angular/directives/dialogs.ts

@@ -1,4 +1,4 @@
-import {ReflectiveInjector, DynamicComponentLoader, ViewContainerRef, Injector, provide, Type, Injectable, ComponentRef, Directive} from 'angular2/core';
+import {ReflectiveInjector, DynamicComponentLoader, ViewContainerRef, Injector, provide, Type, Injectable, ComponentRef, Directive} from '@angular/core';
 import {Page} from 'ui/page';
 import {View} from 'ui/core/view';
 import {DetachedLoader} from '../common/detached-loader';

src/nativescript-angular/directives/list-view-comp.ts

@@ -12,8 +12,8 @@ import {
     ChangeDetectorRef,
     EventEmitter,
     ViewChild,
-    Output} from 'angular2/core';
-import {isListLikeIterable} from 'angular2/src/facade/collection';
+    Output} from '@angular/core';
+import {isListLikeIterable} from '@angular/core/src/facade/collection';
 import {Observable as RxObservable} from 'rxjs'
 import {ListView} from 'ui/list-view';
 import {View} from 'ui/core/view';

src/nativescript-angular/directives/platform-filters.ts

@@ -1,4 +1,4 @@
-import {Component, Inject} from 'angular2/core';
+import {Component, Inject} from '@angular/core';
 import {Device, platformNames} from "platform";
 import {DEVICE} from "../platform-providers";
 
@@ -22,4 +22,4 @@ export class IosFilterComponent {
     constructor( @Inject(DEVICE) device: Device) {
         this.show = (device.os === platformNames.ios);
     }
-}
+}

src/nativescript-angular/directives/tab-view.ts

@@ -1,4 +1,4 @@
-import {ElementRef, Directive, Input, TemplateRef, ViewContainerRef} from "angular2/core";
+import {ElementRef, Directive, Input, TemplateRef, ViewContainerRef} from "@angular/core";
 import {TabView, TabViewItem} from "ui/tab-view";
 
 @Directive({