fix(angular): add NavParams

angular/src/directives/navigation/nav-params.ts

@@ -0,0 +1,45 @@
+/**
+ * @name NavParams
+ * @description
+ * NavParams are an object that exists on a page and can contain data for that particular view.
+ * Similar to how data was pass to a view in V1 with `$stateParams`, NavParams offer a much more flexible
+ * option with a simple `get` method.
+ *
+ * @usage
+ * ```ts
+ * import { NavParams } from '@ionic/angular';
+ *
+ * export class MyClass{
+ *
+ *  constructor(navParams: NavParams){
+ *    // userParams is an object we have in our nav-parameters
+ *    navParams.get('userParams');
+ *  }
+ *
+ * }
+ * ```
+ */
+export class NavParams {
+
+  constructor(public data: {[key: string]: any} = {}) {}
+
+  /**
+   * Get the value of a nav-parameter for the current view
+   *
+   * ```ts
+   * import { NavParams } from 'ionic-angular';
+   *
+   * export class MyClass{
+   *  constructor(public navParams: NavParams){
+   *    // userParams is an object we have in our nav-parameters
+   *    this.navParams.get('userParams');
+   *  }
+   * }
+   * ```
+   *
+   * @param {string} param Which param you want to look up
+   */
+  get(param: string): any {
+    return this.data[param];
+  }
+}

angular/src/providers/angular-delegate.ts

@@ -1,5 +1,6 @@
-import { ApplicationRef, ComponentFactoryResolver, Injectable, Injector, NgZone } from '@angular/core';
+import { ApplicationRef, ComponentFactoryResolver, Injectable, InjectionToken, Injector, NgZone } from '@angular/core';
 import { FrameworkDelegate, ViewLifecycle } from '@ionic/core';
+import { NavParams } from '../directives/navigation/nav-params';
 
 
 @Injectable()
@@ -58,14 +59,14 @@ export function attachView(
   injector: Injector,
   appRef: ApplicationRef,
   elRefMap: WeakMap<HTMLElement, any>,
-  container: any, component: any, data?: any, cssClasses?: string[]) {
+  container: any, component: any, params?: any, cssClasses?: string[]) {
   const componentFactory = cfr.resolveComponentFactory(component);
   const hostElement = document.createElement(componentFactory.selector);
-  if (data) {
-    Object.assign(hostElement, data);
+  if (params) {
+    Object.assign(hostElement, params);
   }
 
-  const childInjector = Injector.create([], injector);
+  const childInjector = Injector.create(getProviders(params), injector);
   const componentRef = componentFactory.create(childInjector, [], hostElement);
   for (const clazz of cssClasses) {
     hostElement.classList.add(clazz);
@@ -95,3 +96,21 @@ export function bindLifecycleEvents(instance: any, element: HTMLElement) {
     });
   });
 }
+
+const NavParamsToken = new InjectionToken<any>('NavParamsToken');
+
+
+function getProviders(params: {[key: string]: any}) {
+  return [
+    {
+      provide: NavParamsToken, useValue: params
+    },
+    {
+      provide: NavParams, useFactory: provideNavParamsInjectable, deps: [NavParamsToken]
+    }
+  ];
+}
+
+function provideNavParamsInjectable(params: {[key: string]: any}) {
+  return new NavParams(params);
+}