mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-21 04:53:58 +08:00
test(e2e): menu/basic
This commit is contained in:
@ -1,145 +0,0 @@
|
|||||||
import { Component, ViewChild, NgModule } from '@angular/core';
|
|
||||||
import { BrowserModule } from '@angular/platform-browser';
|
|
||||||
import { AlertController, IonicApp, IonicModule, MenuController, ModalController, NavController, Nav, ViewController } from '../../../..';
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
templateUrl: 'page1.html'
|
|
||||||
})
|
|
||||||
export class Page1 {
|
|
||||||
constructor(
|
|
||||||
public navCtrl: NavController,
|
|
||||||
public alertCtrl: AlertController,
|
|
||||||
public modalCtrl: ModalController) { }
|
|
||||||
|
|
||||||
myMenu: string = 'right';
|
|
||||||
|
|
||||||
presentAlert() {
|
|
||||||
let alert = this.alertCtrl.create({
|
|
||||||
title: 'New Friend!',
|
|
||||||
message: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
|
|
||||||
cssClass: 'my-alert',
|
|
||||||
buttons: ['Ok']
|
|
||||||
});
|
|
||||||
alert.present();
|
|
||||||
}
|
|
||||||
|
|
||||||
presentModal() {
|
|
||||||
let modal = this.modalCtrl.create(Modal);
|
|
||||||
modal.present();
|
|
||||||
}
|
|
||||||
|
|
||||||
goToPage2() {
|
|
||||||
this.navCtrl.push(Page2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@Component({ templateUrl: 'modal.html' })
|
|
||||||
export class Modal {
|
|
||||||
constructor(public viewController: ViewController) { }
|
|
||||||
close() {
|
|
||||||
this.viewController.dismiss();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@Component({ templateUrl: 'page3.html' })
|
|
||||||
export class Page3 { }
|
|
||||||
|
|
||||||
|
|
||||||
@Component({ templateUrl: 'page2.html' })
|
|
||||||
export class Page2 {
|
|
||||||
constructor(public navCtrl: NavController) { }
|
|
||||||
|
|
||||||
page3() {
|
|
||||||
this.navCtrl.push(Page3);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
templateUrl: 'main.html'
|
|
||||||
})
|
|
||||||
export class E2EPage {
|
|
||||||
rootPage: any;
|
|
||||||
changeDetectionCount: number = 0;
|
|
||||||
pages: Array<{ title: string, component: any }>;
|
|
||||||
@ViewChild(Nav) nav: Nav;
|
|
||||||
|
|
||||||
constructor(public menuCtrl: MenuController) {
|
|
||||||
this.rootPage = Page1;
|
|
||||||
|
|
||||||
this.pages = [
|
|
||||||
{ title: 'Page 1', component: Page1 },
|
|
||||||
{ title: 'Page 2', component: Page2 },
|
|
||||||
{ title: 'Page 3', component: Page3 },
|
|
||||||
];
|
|
||||||
}
|
|
||||||
|
|
||||||
openPage(page: any) {
|
|
||||||
// Reset the content nav to have just this page
|
|
||||||
// we wouldn't want the back button to show in this scenario
|
|
||||||
this.nav.setRoot(page.component).then(() => {
|
|
||||||
// wait for the root page to be completely loaded
|
|
||||||
// then close the menu
|
|
||||||
this.menuCtrl.close();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
openRightMenu() {
|
|
||||||
this.menuCtrl.open('right');
|
|
||||||
}
|
|
||||||
|
|
||||||
openLeftMenu() {
|
|
||||||
this.menuCtrl.open('left');
|
|
||||||
}
|
|
||||||
|
|
||||||
onDrag(ev: any) {
|
|
||||||
console.log('Menu is being dragged', ev);
|
|
||||||
}
|
|
||||||
|
|
||||||
onOpen(ev: any) {
|
|
||||||
console.log('Menu is open', ev);
|
|
||||||
}
|
|
||||||
|
|
||||||
onClose(ev: any) {
|
|
||||||
console.log('Menu is closed', ev);
|
|
||||||
}
|
|
||||||
|
|
||||||
isChangeDetecting() {
|
|
||||||
console.log('Change detection', ++this.changeDetectionCount);
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
template: '<ion-nav [root]="rootPage"></ion-nav>'
|
|
||||||
})
|
|
||||||
export class E2EApp {
|
|
||||||
rootPage = E2EPage;
|
|
||||||
}
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
declarations: [
|
|
||||||
E2EApp,
|
|
||||||
E2EPage,
|
|
||||||
Page1,
|
|
||||||
Page2,
|
|
||||||
Page3,
|
|
||||||
Modal
|
|
||||||
],
|
|
||||||
imports: [
|
|
||||||
BrowserModule,
|
|
||||||
IonicModule.forRoot(E2EApp)
|
|
||||||
],
|
|
||||||
bootstrap: [IonicApp],
|
|
||||||
entryComponents: [
|
|
||||||
E2EApp,
|
|
||||||
E2EPage,
|
|
||||||
Page1,
|
|
||||||
Page2,
|
|
||||||
Page3,
|
|
||||||
Modal
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class AppModule { }
|
|
8
src/components/menu/test/basic/app/app.component.ts
Normal file
8
src/components/menu/test/basic/app/app.component.ts
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
template: '<ion-nav [root]="rootPage"></ion-nav>'
|
||||||
|
})
|
||||||
|
export class E2EApp {
|
||||||
|
rootPage = 'E2EPage';
|
||||||
|
}
|
30
src/components/menu/test/basic/app/app.module.ts
Normal file
30
src/components/menu/test/basic/app/app.module.ts
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { BrowserModule } from '@angular/platform-browser';
|
||||||
|
import { IonicApp, IonicModule } from '../../../../..';
|
||||||
|
|
||||||
|
import { Modal } from '../pages/modal/modal';
|
||||||
|
import { E2EApp } from './app.component';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
E2EApp,
|
||||||
|
Modal,
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
BrowserModule,
|
||||||
|
IonicModule.forRoot(E2EApp, {}, {
|
||||||
|
links: [
|
||||||
|
{ loadChildren: '../pages/main/main.module#E2EPageModule', name: 'E2EPage' },
|
||||||
|
{ loadChildren: '../pages/page1/page1.module#Page1Module', name: 'Page1' },
|
||||||
|
{ loadChildren: '../pages/page2/page2.module#Page2Module', name: 'Page2' },
|
||||||
|
{ loadChildren: '../pages/page3/page3.module#Page3Module', name: 'Page3' },
|
||||||
|
]
|
||||||
|
})
|
||||||
|
],
|
||||||
|
bootstrap: [IonicApp],
|
||||||
|
entryComponents: [
|
||||||
|
E2EApp,
|
||||||
|
Modal,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class AppModule { }
|
17
src/components/menu/test/basic/pages/main/main.module.ts
Normal file
17
src/components/menu/test/basic/pages/main/main.module.ts
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { DeepLinkModule } from '../../../../../..';
|
||||||
|
|
||||||
|
import { E2EPage } from './main';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
E2EPage,
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
DeepLinkModule.forChild(E2EPage)
|
||||||
|
],
|
||||||
|
entryComponents: [
|
||||||
|
E2EPage,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class E2EPageModule {}
|
58
src/components/menu/test/basic/pages/main/main.ts
Normal file
58
src/components/menu/test/basic/pages/main/main.ts
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
import { Component, ViewChild } from '@angular/core';
|
||||||
|
import { MenuController, Nav } from '../../../../../..';
|
||||||
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
templateUrl: 'main.html'
|
||||||
|
})
|
||||||
|
export class E2EPage {
|
||||||
|
rootPage: any;
|
||||||
|
changeDetectionCount: number = 0;
|
||||||
|
pages: Array<{ title: string, component: any }>;
|
||||||
|
@ViewChild(Nav) nav: Nav;
|
||||||
|
|
||||||
|
constructor(public menuCtrl: MenuController) {
|
||||||
|
this.rootPage = 'Page1';
|
||||||
|
|
||||||
|
this.pages = [
|
||||||
|
{ title: 'Page 1', component: 'Page1' },
|
||||||
|
{ title: 'Page 2', component: 'Page2' },
|
||||||
|
{ title: 'Page 3', component: 'Page3' },
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
openPage(page: any) {
|
||||||
|
// Reset the content nav to have just this page
|
||||||
|
// we wouldn't want the back button to show in this scenario
|
||||||
|
this.nav.setRoot(page.component).then(() => {
|
||||||
|
// wait for the root page to be completely loaded
|
||||||
|
// then close the menu
|
||||||
|
this.menuCtrl.close();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
openRightMenu() {
|
||||||
|
this.menuCtrl.open('right');
|
||||||
|
}
|
||||||
|
|
||||||
|
openLeftMenu() {
|
||||||
|
this.menuCtrl.open('left');
|
||||||
|
}
|
||||||
|
|
||||||
|
onDrag(ev: any) {
|
||||||
|
console.log('Menu is being dragged', ev);
|
||||||
|
}
|
||||||
|
|
||||||
|
onOpen(ev: any) {
|
||||||
|
console.log('Menu is open', ev);
|
||||||
|
}
|
||||||
|
|
||||||
|
onClose(ev: any) {
|
||||||
|
console.log('Menu is closed', ev);
|
||||||
|
}
|
||||||
|
|
||||||
|
isChangeDetecting() {
|
||||||
|
console.log('Change detection', ++this.changeDetectionCount);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
10
src/components/menu/test/basic/pages/modal/modal.ts
Normal file
10
src/components/menu/test/basic/pages/modal/modal.ts
Normal file
@ -0,0 +1,10 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
import { ViewController } from '../../../../../..';
|
||||||
|
|
||||||
|
@Component({ templateUrl: 'modal.html' })
|
||||||
|
export class Modal {
|
||||||
|
constructor(public viewController: ViewController) { }
|
||||||
|
close() {
|
||||||
|
this.viewController.dismiss();
|
||||||
|
}
|
||||||
|
}
|
@ -7,7 +7,7 @@
|
|||||||
</button>
|
</button>
|
||||||
|
|
||||||
<ion-title>
|
<ion-title>
|
||||||
Menu
|
Menu!!!!!!!!!
|
||||||
</ion-title>
|
</ion-title>
|
||||||
|
|
||||||
<ion-buttons end>
|
<ion-buttons end>
|
17
src/components/menu/test/basic/pages/page1/page1.module.ts
Normal file
17
src/components/menu/test/basic/pages/page1/page1.module.ts
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { DeepLinkModule } from '../../../../../..';
|
||||||
|
|
||||||
|
import { Page1 } from './page1';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
Page1,
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
DeepLinkModule.forChild(Page1)
|
||||||
|
],
|
||||||
|
entryComponents: [
|
||||||
|
Page1,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class Page1Module {}
|
35
src/components/menu/test/basic/pages/page1/page1.ts
Normal file
35
src/components/menu/test/basic/pages/page1/page1.ts
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
import { AlertController, ModalController, NavController } from '../../../../../..';
|
||||||
|
|
||||||
|
import { Modal } from '../modal/modal';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
templateUrl: 'page1.html'
|
||||||
|
})
|
||||||
|
export class Page1 {
|
||||||
|
constructor(
|
||||||
|
public navCtrl: NavController,
|
||||||
|
public alertCtrl: AlertController,
|
||||||
|
public modalCtrl: ModalController) { }
|
||||||
|
|
||||||
|
myMenu: string = 'right';
|
||||||
|
|
||||||
|
presentAlert() {
|
||||||
|
let alert = this.alertCtrl.create({
|
||||||
|
title: 'New Friend!',
|
||||||
|
message: 'Your friend, Obi wan Kenobi, just accepted your friend request!',
|
||||||
|
cssClass: 'my-alert',
|
||||||
|
buttons: ['Ok']
|
||||||
|
});
|
||||||
|
alert.present();
|
||||||
|
}
|
||||||
|
|
||||||
|
presentModal() {
|
||||||
|
let modal = this.modalCtrl.create(Modal);
|
||||||
|
modal.present();
|
||||||
|
}
|
||||||
|
|
||||||
|
goToPage2() {
|
||||||
|
this.navCtrl.push('Page2');
|
||||||
|
}
|
||||||
|
}
|
17
src/components/menu/test/basic/pages/page2/page2.module.ts
Normal file
17
src/components/menu/test/basic/pages/page2/page2.module.ts
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { DeepLinkModule } from '../../../../../..';
|
||||||
|
|
||||||
|
import { Page2 } from './page2';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
Page2,
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
DeepLinkModule.forChild(Page2)
|
||||||
|
],
|
||||||
|
entryComponents: [
|
||||||
|
Page2,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class Page2Module {}
|
11
src/components/menu/test/basic/pages/page2/page2.ts
Normal file
11
src/components/menu/test/basic/pages/page2/page2.ts
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
import { NavController } from '../../../../../..';
|
||||||
|
|
||||||
|
@Component({ templateUrl: 'page2.html' })
|
||||||
|
export class Page2 {
|
||||||
|
constructor(public navCtrl: NavController) { }
|
||||||
|
|
||||||
|
page3() {
|
||||||
|
this.navCtrl.push('Page3');
|
||||||
|
}
|
||||||
|
}
|
17
src/components/menu/test/basic/pages/page3/page3.module.ts
Normal file
17
src/components/menu/test/basic/pages/page3/page3.module.ts
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { DeepLinkModule } from '../../../../../..';
|
||||||
|
|
||||||
|
import { Page3 } from './page3';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
Page3,
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
DeepLinkModule.forChild(Page3)
|
||||||
|
],
|
||||||
|
entryComponents: [
|
||||||
|
Page3,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class Page3Module {}
|
4
src/components/menu/test/basic/pages/page3/page3.ts
Normal file
4
src/components/menu/test/basic/pages/page3/page3.ts
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({ templateUrl: 'page3.html' })
|
||||||
|
export class Page3 { }
|
Reference in New Issue
Block a user