diff --git a/src/components/tabs/test/basic/app.module.ts b/src/components/tabs/test/basic/app.module.ts
deleted file mode 100644
index 9ec336383d..0000000000
--- a/src/components/tabs/test/basic/app.module.ts
+++ /dev/null
@@ -1,310 +0,0 @@
-import { Component, NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { Config, IonicApp, IonicModule, App, AlertController, ModalController, ViewController, Tab, Tabs } from '../../../..';
-
-//
-// Modal
-//
-@Component({
- template: `
-
-
-
-
-
-
-
- Filter Sessions
-
-
-
-
-
-
-
-
-
-
- Tracks
-
-
- Toggle {{i}}
-
-
-
-
-
-
-
-
-
- `
-})
-export class MyModal {
- items: any[] = [];
-
- constructor(private viewCtrl: ViewController, private app: App) {
- for (var i = 1; i <= 10; i++) {
- this.items.push(i);
- }
- }
-
- dismiss() {
- // using the injected ViewController this page
- // can "dismiss" itself and pass back data
- this.viewCtrl.dismiss();
- }
-
- appNavPop() {
- this.app.navPop();
- }
-}
-
-//
-// Tab 1
-//
-@Component({
- template: `
-
-
- Settings
-
-
-
-
-
-
- Tab 1
-
- Item {{i}} {{i}} {{i}} {{i}}
-
-
-
-
-
-
-
-
- `
-})
-export class Tab1 {
- items: any[] = [];
-
- constructor(private tabs: Tabs, private app: App) {
- for (var i = 1; i <= 250; i++) {
- this.items.push(i);
- }
- }
-
- selectPrevious() {
- this.tabs.select(this.tabs.previousTab());
- }
-
- appNavPop() {
- this.app.navPop();
- }
-}
-
-//
-// Tab 2
-//
-@Component({
- template: `
-
-
- Schedule
-
-
-
-
-
-
-
- {{session.name}} {{session.name}} {{session.name}}
- {{session.location}} {{session.location}} {{session.location}}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `
-})
-export class Tab2 {
- sessions: any[] = [];
-
- constructor(private tabs: Tabs, private app: App) {
- for (var i = 1; i <= 250; i++) {
- this.sessions.push({
- name: 'Name ' + i,
- location: 'Location: ' + i
- });
- }
- }
-
- selectPrevious() {
- this.tabs.select(this.tabs.previousTab());
- }
-
- appNavPop() {
- this.app.navPop();
- }
-}
-
-//
-// Tab 3
-//
-@Component({
- template: `
-
-
-
- Stopwatch
-
-
-
-
- Tab 3
-
-
-
-
-
-
-
-
-
-
-
-
- Item: {{item}}
-
-
-
-
-
- `
-})
-export class Tab3 {
- items: number[] = [];
-
- constructor(private alertCtrl: AlertController, private modalCtrl: ModalController, private tabs: Tabs, private app: App) {
- for (var i = 0; i < 100; i++) {
- this.items.push(i);
- }
- }
-
- presentAlert() {
- let alert = this.alertCtrl.create({
- title: 'Alert Title!',
- buttons: ['Dismiss']
- });
- alert.present();
- }
-
- presentModal() {
- this.modalCtrl.create(MyModal).present();
- }
-
- selectPrevious() {
- this.tabs.select(this.tabs.previousTab());
- }
-
- appNavPop() {
- this.app.navPop();
- }
-}
-
-
-@Component({
- template: `
-
-
-
- Menu
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- `
-})
-export class TabsPage {
- root1 = Tab1;
- root2 = Tab2;
- root3 = Tab3;
- myColor: string;
-
- constructor(config: Config) {
- this.myColor = (config.get('mode') !== 'ios') ? 'primary' : null;
- }
-
- onChange(ev: Tab) {
- console.log('Changed tab', ev);
- }
-
- onSelect(ev: Tab) {
- console.log('Selected tab', ev);
- }
-}
-
-@Component({
- template: ``
-})
-export class E2EApp {
- root = TabsPage;
-}
-
-@NgModule({
- declarations: [
- E2EApp,
- MyModal,
- Tab1,
- Tab2,
- Tab3,
- TabsPage
- ],
- imports: [
- BrowserModule,
- IonicModule.forRoot(E2EApp, {
- tabsHighlight: true,
- })
- ],
- bootstrap: [IonicApp],
- entryComponents: [
- E2EApp,
- MyModal,
- Tab1,
- Tab2,
- Tab3,
- TabsPage
- ]
-})
-export class AppModule {}
diff --git a/src/components/tabs/test/basic/app/app.component.ts b/src/components/tabs/test/basic/app/app.component.ts
new file mode 100644
index 0000000000..46db227ce4
--- /dev/null
+++ b/src/components/tabs/test/basic/app/app.component.ts
@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+ template: ``
+})
+export class E2EApp {
+ root = 'TabsPage';
+}
diff --git a/src/components/tabs/test/basic/app/app.module.ts b/src/components/tabs/test/basic/app/app.module.ts
new file mode 100644
index 0000000000..465bcfba47
--- /dev/null
+++ b/src/components/tabs/test/basic/app/app.module.ts
@@ -0,0 +1,36 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { IonicApp, IonicModule } from '../../../../..';
+
+import { E2EApp } from './app.component';
+import { Tab1 } from '../components/tab1';
+import { Tab2 } from '../components/tab2';
+import { Tab3 } from '../components/tab3';
+
+@NgModule({
+ declarations: [
+ E2EApp,
+ Tab1,
+ Tab2,
+ Tab3,
+ ],
+ imports: [
+ BrowserModule,
+ IonicModule.forRoot(E2EApp, {
+ tabsHighlight: true,
+ }, {
+ links: [
+ { loadChildren: '../pages/tabs-page/tabs.module#TabsPageModule', name: 'TabsPage' },
+ { loadChildren: '../components/modal/modal.module#MyModalModule', name: 'MyModal' },
+ ]
+ })
+ ],
+ bootstrap: [IonicApp],
+ entryComponents: [
+ E2EApp,
+ Tab1,
+ Tab2,
+ Tab3,
+ ]
+})
+export class AppModule {}
diff --git a/src/components/tabs/test/basic/main.ts b/src/components/tabs/test/basic/app/main.ts
similarity index 100%
rename from src/components/tabs/test/basic/main.ts
rename to src/components/tabs/test/basic/app/main.ts
diff --git a/src/components/tabs/test/basic/components/modal/modal.module.ts b/src/components/tabs/test/basic/components/modal/modal.module.ts
new file mode 100644
index 0000000000..7d130f277f
--- /dev/null
+++ b/src/components/tabs/test/basic/components/modal/modal.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { DeepLinkModule } from '../../../../../..';
+
+import { MyModal } from './modal';
+
+@NgModule({
+ declarations: [
+ MyModal,
+ ],
+ imports: [
+ DeepLinkModule.forChild(MyModal)
+ ],
+ entryComponents: [
+ MyModal,
+ ]
+})
+export class MyModalModule {}
diff --git a/src/components/tabs/test/basic/components/modal/modal.ts b/src/components/tabs/test/basic/components/modal/modal.ts
new file mode 100644
index 0000000000..f68a0fe5ef
--- /dev/null
+++ b/src/components/tabs/test/basic/components/modal/modal.ts
@@ -0,0 +1,61 @@
+import { Component } from '@angular/core';
+import { App, AlertController, ViewController } from '../../../../../..';
+
+@Component({
+ template: `
+
+
+
+
+
+
+
+ Filter Sessions
+
+
+
+
+
+
+
+
+
+
+ Tracks
+
+
+ Toggle {{i}}
+
+
+
+
+
+
+
+
+
+ `
+})
+export class MyModal {
+ items: any[] = [];
+
+ constructor(private viewCtrl: ViewController, private app: App) {
+ for (var i = 1; i <= 10; i++) {
+ this.items.push(i);
+ }
+ }
+
+ dismiss() {
+ // using the injected ViewController this page
+ // can "dismiss" itself and pass back data
+ this.viewCtrl.dismiss();
+ }
+
+ appNavPop() {
+ this.app.navPop();
+ }
+}
diff --git a/src/components/tabs/test/basic/components/tab1.ts b/src/components/tabs/test/basic/components/tab1.ts
new file mode 100644
index 0000000000..93d30af186
--- /dev/null
+++ b/src/components/tabs/test/basic/components/tab1.ts
@@ -0,0 +1,44 @@
+import { Component } from '@angular/core';
+import { App, Tabs } from '../../../../..';
+
+@Component({
+ template: `
+
+
+ Settings
+
+
+
+
+
+
+ Tab 1
+
+ Item {{i}} {{i}} {{i}} {{i}}
+
+
+
+
+
+
+
+
+ `
+})
+export class Tab1 {
+ items: any[] = [];
+
+ constructor(private tabs: Tabs, private app: App) {
+ for (var i = 1; i <= 250; i++) {
+ this.items.push(i);
+ }
+ }
+
+ selectPrevious() {
+ this.tabs.select(this.tabs.previousTab());
+ }
+
+ appNavPop() {
+ this.app.navPop();
+ }
+}
diff --git a/src/components/tabs/test/basic/components/tab2.ts b/src/components/tabs/test/basic/components/tab2.ts
new file mode 100644
index 0000000000..3cd06b9db9
--- /dev/null
+++ b/src/components/tabs/test/basic/components/tab2.ts
@@ -0,0 +1,53 @@
+import { Component } from '@angular/core';
+import { App, Tabs } from '../../../../..';
+
+@Component({
+ template: `
+
+
+ Schedule
+
+
+
+
+
+
+
+ {{session.name}} {{session.name}} {{session.name}}
+ {{session.location}} {{session.location}} {{session.location}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ `
+})
+export class Tab2 {
+ sessions: any[] = [];
+
+ constructor(private tabs: Tabs, private app: App) {
+ for (var i = 1; i <= 250; i++) {
+ this.sessions.push({
+ name: 'Name ' + i,
+ location: 'Location: ' + i
+ });
+ }
+ }
+
+ selectPrevious() {
+ this.tabs.select(this.tabs.previousTab());
+ }
+
+ appNavPop() {
+ this.app.navPop();
+ }
+}
diff --git a/src/components/tabs/test/basic/components/tab3.ts b/src/components/tabs/test/basic/components/tab3.ts
new file mode 100644
index 0000000000..ae976c3c00
--- /dev/null
+++ b/src/components/tabs/test/basic/components/tab3.ts
@@ -0,0 +1,65 @@
+import { Component } from '@angular/core';
+import { App, AlertController, ModalController, Tabs } from '../../../../..';
+
+@Component({
+ template: `
+
+
+
+ Stopwatch
+
+
+
+
+ Tab 3
+
+
+
+
+
+
+
+
+
+
+
+
+ Item: {{item}}
+
+
+
+
+
+ `
+})
+export class Tab3 {
+ items: number[] = [];
+
+ constructor(private alertCtrl: AlertController, private modalCtrl: ModalController, private tabs: Tabs, private app: App) {
+ for (var i = 0; i < 100; i++) {
+ this.items.push(i);
+ }
+ }
+
+ presentAlert() {
+ let alert = this.alertCtrl.create({
+ title: 'Alert Title!',
+ buttons: ['Dismiss']
+ });
+ alert.present();
+ }
+
+ presentModal() {
+ this.modalCtrl.create('MyModal').present();
+ }
+
+ selectPrevious() {
+ this.tabs.select(this.tabs.previousTab());
+ }
+
+ appNavPop() {
+ this.app.navPop();
+ }
+}
diff --git a/src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts b/src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts
new file mode 100644
index 0000000000..75e3e2ff5c
--- /dev/null
+++ b/src/components/tabs/test/basic/pages/tabs-page/tabs.module.ts
@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { DeepLinkModule } from '../../../../../..';
+
+import { TabsPage } from './tabs';
+
+@NgModule({
+ declarations: [
+ TabsPage,
+ ],
+ imports: [
+ DeepLinkModule.forChild(TabsPage)
+ ],
+ entryComponents: [
+ TabsPage,
+ ]
+})
+export class TabsPageModule {}
diff --git a/src/components/tabs/test/basic/pages/tabs-page/tabs.ts b/src/components/tabs/test/basic/pages/tabs-page/tabs.ts
new file mode 100644
index 0000000000..a33f3db31f
--- /dev/null
+++ b/src/components/tabs/test/basic/pages/tabs-page/tabs.ts
@@ -0,0 +1,51 @@
+import { Component } from '@angular/core';
+import { Config, Tab } from '../../../../../..';
+
+import { Tab1 } from '../../components/tab1';
+import { Tab2 } from '../../components/tab2';
+import { Tab3 } from '../../components/tab3';
+
+@Component({
+ template: `
+
+
+
+ Menu
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ `
+})
+export class TabsPage {
+ root1 = Tab1;
+ root2 = Tab2;
+ root3 = Tab3;
+ myColor: string;
+
+ constructor(config: Config) {
+ this.myColor = (config.get('mode') !== 'ios') ? 'primary' : null;
+ }
+
+ onChange(ev: Tab) {
+ console.log('Changed tab', ev);
+ }
+
+ onSelect(ev: Tab) {
+ console.log('Selected tab', ev);
+ }
+}