javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 03:32:21 +08:00
Code Issues Packages Projects Releases Wiki Activity

modal

Browse Source
This commit is contained in:
Max Lynch
2015-06-26 16:52:59 -05:00
parent b19b4a9c0f
commit 3b702e00eb
1 changed files with 16 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
ionic/components/app/test/sink/pages/modal.js
View File

@ -3,13 +3,13 @@ import {Ancestor} from 'angular2/src/core/annotations_impl/visibility';
import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations'; import {Component, Directive} from 'angular2/src/core/annotations_impl/annotations';
import {View} from 'angular2/src/core/annotations_impl/view'; import {View} from 'angular2/src/core/annotations_impl/view';
import {ActionMenu, Modal, ModalRef, import {IonicView, ActionMenu, Modal, NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
NavbarTemplate, Navbar, NavController, Content} from 'ionic/ionic';
@Component({ @Component({
selector: 'ion-view' selector: 'ion-view',
appInjector: [Modal]
}) })
@View({ @IonicView({
template: ` template: `
<ion-navbar *navbar><ion-title>Modal</ion-title></ion-navbar> <ion-navbar *navbar><ion-title>Modal</ion-title></ion-navbar>
@ -29,45 +29,27 @@ import {ActionMenu, Modal, ModalRef,
directives: [NavbarTemplate, Navbar, Content] directives: [NavbarTemplate, Navbar, Content]
}) })
export class ModalPage { export class ModalPage {
constructor(nav: NavController, loader: DynamicComponentLoader, injector: Injector, domRenderer: DomRenderer, elementRef: ElementRef) { constructor(Modal: Modal) {
this.loader = loader; this.Modal = Modal;
this.domRenderer = domRenderer;
this.elementRef = elementRef;
this.injector = injector;
this.nav = nav;
window.nav = nav;
console.log('IonicApp Start', loader, domRenderer, elementRef);
} }
openModal() { openModal() {
console.log('Opening modal'); console.log('Opening modal');
Modal.show(MyModal, this.loader, this.injector, this.domRenderer, this.elementRef); this.Modal.open(MyModal, {
enterAnimation: 'my-fade-in',
leaveAnimation: 'my-fade-out',
handle: 'my-awesome-modal'
});
} }
openMenu() {
console.log('Opening Modal')
}
} }
@Component({ @IonicComponent(Modal)
selector: 'my-modal' @IonicView({
})
@View({
template: '<ion-content padding><button (click)="close()" primary>Close Modal</button></ion-content>', template: '<ion-content padding><button (click)="close()" primary>Close Modal</button></ion-content>',
directives: [Content]
}) })
export class MyModal { export class MyModal extends Modal {
constructor(modalRef: ModalRef) { constructor() {
//this.initial = ModalFirstPage; super();
this.modalRef = modalRef;
}
close() {
console.log('Closing modal');
this.modalRef.close();
} }
} }