diff --git a/ionic/components/aside/aside.js b/ionic/components/aside/aside.js
index f444303dc5..94992cb817 100644
--- a/ionic/components/aside/aside.js
+++ b/ionic/components/aside/aside.js
@@ -57,8 +57,8 @@ export class Aside {
}
onInit() {
- console.log('Aside content', this.content);
- this.contentElement = (this.content instanceof Node) ? this.content : this.content.ele;
+ this.contentElement = (this.content instanceof Node) ? this.content : this.content.getNativeElement();
+ console.log('Aside content', this.content, this.contentElement);
Aside.applyConfig(this);
this.gestureDelegate = Aside.getDelegate(this, 'gesture');
diff --git a/ionic/components/content/content.js b/ionic/components/content/content.js
index dcc7b4de8d..a931333f74 100644
--- a/ionic/components/content/content.js
+++ b/ionic/components/content/content.js
@@ -2,6 +2,8 @@ import {ElementRef} from 'angular2/angular2'
import {Component} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view';
+import {Ion} from '../ion';
+
@Component({
selector: 'ion-content'
@@ -9,15 +11,12 @@ import {View} from 'angular2/src/core/annotations_impl/view';
@View({
template: `
`
})
-export class Content {
+export class Content extends Ion{
constructor(elementRef: ElementRef) {
- // TODO(maxlynch): we need this nativeElement for things like aside, etc.
- // but we should be able to stamp out this behavior with a base IonicComponent
- // or something, so all elements have a nativeElement reference or a getElement() method
- this.ele = elementRef.nativeElement;
+ super(elementRef);
setTimeout(() => {
- this.scrollElement = this.ele.children[0];
+ this.scrollElement = elementRef.nativeElement.children[0];
});
}
diff --git a/ionic/components/ion.js b/ionic/components/ion.js
new file mode 100644
index 0000000000..927002c1e1
--- /dev/null
+++ b/ionic/components/ion.js
@@ -0,0 +1,15 @@
+/**
+ * Base class for all Ionic components. Exposes some common functionality
+ * that all Ionic components need, such as accessing underlying native elements and
+ * sending/receiving app-level events.
+ */
+export class Ion {
+ constructor(elementRef: ElementRef) {
+ console.log('ION INIT', elementRef);
+ this.elementRef = elementRef;
+ }
+
+ getNativeElement() {
+ return this.elementRef.nativeElement;
+ }
+}
diff --git a/ionic/components/nav/nav.js b/ionic/components/nav/nav.js
index 8133c690db..235e289d65 100644
--- a/ionic/components/nav/nav.js
+++ b/ionic/components/nav/nav.js
@@ -23,9 +23,10 @@ export class Nav extends ViewController {
constructor(
@Optional() parentViewCtrl: ViewController,
- injector: Injector
+ injector: Injector,
+ elementRef: ElementRef
) {
- super(parentViewCtrl, injector);
+ super(parentViewCtrl, injector, elementRef);
}
onInit() {
diff --git a/ionic/components/tabs/tab.js b/ionic/components/tabs/tab.js
index 935836f420..9bd27152df 100644
--- a/ionic/components/tabs/tab.js
+++ b/ionic/components/tabs/tab.js
@@ -38,7 +38,7 @@ export class Tab extends ViewController {
// A Tab is both a container of many views, and is a view itself.
// A Tab is one ViewItem within it's parent Tabs (which extends ViewController)
// A Tab is a ViewController for its child ViewItems
- super(tabs, injector);
+ super(tabs, injector, elementRef);
this.tabs = tabs;
this.childNavbar(true);
diff --git a/ionic/components/tabs/tabs.js b/ionic/components/tabs/tabs.js
index a12041060c..052ee9d603 100644
--- a/ionic/components/tabs/tabs.js
+++ b/ionic/components/tabs/tabs.js
@@ -2,7 +2,7 @@ import {Optional} from 'angular2/src/di/annotations_impl'
import {Component, onInit} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view';
import {Injector} from 'angular2/di';
-import {NgFor} from 'angular2/angular2';
+import {NgFor, ElementRef} from 'angular2/angular2';
import {ViewController} from '../view/view-controller';
import {ViewItem} from '../view/view-item';
@@ -43,9 +43,10 @@ export class Tabs extends ViewController {
constructor(
@Optional() parentViewCtrl: ViewController,
@Optional() viewItem: ViewItem,
- injector: Injector
+ injector: Injector,
+ elementRef: ElementRef
) {
- super(parentViewCtrl, injector);
+ super(parentViewCtrl, injector, elementRef);
// Tabs may also be an actual ViewItem which was navigated to
// if Tabs is static and not navigated to within a ViewController
diff --git a/ionic/components/view/view-controller.js b/ionic/components/view/view-controller.js
index 7b90d12592..e76240707d 100644
--- a/ionic/components/view/view-controller.js
+++ b/ionic/components/view/view-controller.js
@@ -4,6 +4,7 @@ import {DynamicComponentLoader} from 'angular2/src/core/compiler/dynamic_compone
import {AppViewManager} from 'angular2/src/core/compiler/view_manager';
import {Injector, bind} from 'angular2/di';
+import {Ion} from '../ion';
import {IonicApp} from '../app/app';
import {IonicRouter} from '../../routing/router';
import {ViewItem} from './view-item';
@@ -13,13 +14,14 @@ import {Transition} from '../../transitions/transition';
import {ClickBlock} from '../../util/click-block';
import * as util from 'ionic/util';
-
-export class ViewController {
+export class ViewController extends Ion {
constructor(
parentViewCtrl: ViewController,
- injector: Injector
+ injector: Injector,
+ elementRef: ElementRef
) {
+ super(elementRef);
this.parent = parentViewCtrl;
diff --git a/ionic/components/view/view.js b/ionic/components/view/view.js
index 24b090d655..561d033339 100644
--- a/ionic/components/view/view.js
+++ b/ionic/components/view/view.js
@@ -4,12 +4,14 @@ import {Optional} from 'angular2/src/di/annotations_impl'
import {ViewItem} from './view-item';
+import {Ion} from '../ion';
@Directive({
selector: 'ion-view',
})
-export class IonView {
+export class IonView extends Ion {
constructor(@Optional() item: ViewItem, elementRef: ElementRef) {
+ super(elementRef);
this.ele = elementRef.nativeElement;
}
}