feat(viewcontroller): add onWillDismiss callback

Fixed #6702

demos/toast/index.ts

@@ -16,7 +16,7 @@ class ApiDemoPage {
       duration: 3000
     });
 
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
@@ -26,7 +26,7 @@ class ApiDemoPage {
       duration: 3000
     });
 
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
@@ -35,7 +35,7 @@ class ApiDemoPage {
       message: 'I am dismissed after 1.5 seconds',
       duration: 1500
     });
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
@@ -45,12 +45,12 @@ class ApiDemoPage {
       showCloseButton: true,
       closeButtonText: 'Ok'
     });
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
   private dismissHandler() {
-    console.info('Toast onDismiss()');
+    console.info('Toast onDidDismiss()');
   }
 
 }

src/components/alert/test/basic/index.ts

@@ -136,8 +136,8 @@ class E2EPage {
       this.testPromptOpen = true;
     });
 
-    alert.onDismiss((data: any, role: any) => {
+    alert.onDidDismiss((data: any, role: any) => {
-      console.log('onDismiss, data:', data, 'role:', role);
+      console.log('onDidDismiss, data:', data, 'role:', role);
     });
   }
 

src/components/alert/test/dismiss/index.ts

@@ -24,7 +24,7 @@ export class E2EPage {
       ]
     });
 
-    alert.onDismiss(() => {
+    alert.onDidDismiss(() => {
       console.log('dismiss');
       this.nav.push(AnotherPage);
     });

src/components/datetime/datetime.ts

@@ -489,7 +489,7 @@ export class DateTime {
     picker.present(pickerOptions);
 
     this._isOpen = true;
-    picker.onDismiss(() => {
+    picker.onDidDismiss(() => {
       this._isOpen = false;
     });
   }

src/components/loading/loading.ts

@@ -85,7 +85,7 @@ export class Loading extends ViewController {
  * will show even during page changes, but this can be disabled by setting
  * `dismissOnPageChange` to `true`. To dismiss the loading indicator after
  * creation, call the `dismiss()` method on the Loading instance. The
- * `onDismiss` function can be called to perform an action after the loading
+ * `onDidDismiss` function can be called to perform an action after the loading
  * indicator is dismissed.
  *
  * >Note that after the component is dismissed, it will not be usable anymore
@@ -126,7 +126,7 @@ export class Loading extends ViewController {
  *     duration: 5000
  *   });
  *
- *   loading.onDismiss(() => {
+ *   loading.onDidDismiss(() => {
  *     console.log('Dismissed loading');
  *   });
  *

src/components/loading/test/basic/index.ts

@@ -15,7 +15,7 @@ class E2EPage {
       cssClass: 'my-custom-loader'
     });
 
-    loading.onDismiss(() => {
+    loading.onDidDismiss(() => {
      console.log('Dismissed loading');
     });
 

src/components/modal/modal.ts

@@ -145,7 +145,7 @@ export class Modal extends ViewController {
  *
  *  presentProfileModal() {
  *    let profileModal = this.modalCtrl.create(Profile, { userId: 8675309 });
- *    profileModal.onDismiss(data => {
+ *    profileModal.onDidDismiss(data => {
  *      console.log(data);
  *    });
  *    profileModal.present();

src/components/modal/test/basic/index.ts

@@ -36,8 +36,13 @@ class E2EPage {
     let modal = this.modalCtrl.create(ModalPassData, { userId: 8675309 });
     modal.present();
 
-    modal.onDismiss((data: any) => {
+    modal.onWillDismiss((data: any) => {
+      console.log('WILL DISMISS with data', data);
+      console.timeEnd('modal');
+    });
+    modal.onDidDismiss((data: any) => {
       console.log('modal data', data);
+      console.timeEnd('modal');
     });
   }
 
@@ -56,7 +61,7 @@ class E2EPage {
 
   presentModalWithInputs() {
 	  let modal = this.modalCtrl.create(ModalWithInputs);
-    modal.onDismiss((data: any) => {
+    modal.onDidDismiss((data: any) => {
       console.log('Modal with inputs data:', data);
     });
     modal.present();
@@ -153,27 +158,28 @@ class ModalPassData {
   }
 
   submit() {
+    console.time('modal');
     this.viewCtrl.dismiss(this.data);
   }
 
   ionViewLoaded(){
-    console.log("ModalPassData ionViewLoaded fired");
+    console.log('ModalPassData ionViewLoaded fired');
   }
 
   ionViewWillEnter(){
-    console.log("ModalPassData ionViewWillEnter fired");
+    console.log('ModalPassData ionViewWillEnter fired');
   }
 
   ionViewDidEnter(){
-    console.log("ModalPassData ionViewDidEnter fired");
+    console.log('ModalPassData ionViewDidEnter fired');
   }
 
   ionViewWillLeave(){
-    console.log("ModalPassData ionViewWillLeave fired");
+    console.log('ModalPassData ionViewWillLeave fired');
   }
 
   ionViewDidLeave(){
-    console.log("ModalPassData ionViewDidLeave fired");
+    console.log('ModalPassData ionViewDidLeave fired');
   }
 }
 
@@ -365,15 +371,15 @@ class ModalFirstPage {
   }
 
   ionViewLoaded(){
-    console.log("ModalFirstPage ionViewLoaded fired");
+    console.log('ModalFirstPage ionViewLoaded fired');
   }
 
   ionViewWillEnter(){
-    console.log("ModalFirstPage ionViewWillEnter fired");
+    console.log('ModalFirstPage ionViewWillEnter fired');
   }
 
   ionViewDidEnter(){
-    console.log("ModalFirstPage ionViewDidEnter fired");
+    console.log('ModalFirstPage ionViewDidEnter fired');
   }
 
   openActionSheet() {
@@ -446,15 +452,15 @@ class ModalSecondPage {
   }
 
   ionViewLoaded(){
-    console.log("ModalSecondPage ionViewLoaded");
+    console.log('ModalSecondPage ionViewLoaded');
   }
 
   ionViewWillEnter(){
-    console.log("ModalSecondPage ionViewWillEnter");
+    console.log('ModalSecondPage ionViewWillEnter');
   }
 
   ionViewDidEnter(){
-    console.log("ModalSecondPage ionViewDidEnter");
+    console.log('ModalSecondPage ionViewDidEnter');
   }
 }
 

src/components/nav/view-controller.ts

@@ -36,7 +36,8 @@ export class ViewController {
   private _leavingOpts: NavOptions = null;
   private _loaded: boolean = false;
   private _nbDir: Navbar;
-  private _onDismiss: Function = null;
+  private _onDidDismiss: Function = null;
+  private _onWillDismiss: Function = null;
   private _pgRef: ElementRef;
   private _cd: ChangeDetectorRef;
   protected _nav: NavController;
@@ -120,7 +121,23 @@ export class ViewController {
    * @private
    */
   onDismiss(callback: Function) {
-    this._onDismiss = callback;
+    // deprecated warning: added beta.11 2016-06-30
+    console.warn('onDismiss(..) has been deprecated. Please use onDidDismiss(..) instead');
+    this.onDidDismiss(callback);
+  }
+
+  /**
+   * @private
+   */
+  onDidDismiss(callback: Function) {
+    this._onDidDismiss = callback;
+  }
+
+  /**
+   * @private
+   */
+  onWillDismiss(callback: Function) {
+    this._onWillDismiss = callback;
   }
 
   /**
@@ -128,8 +145,9 @@ export class ViewController {
    */
   dismiss(data?: any, role?: any, navOptions: NavOptions = {}) {
     let options = merge({}, this._leavingOpts, navOptions);
+    this._onWillDismiss && this._onWillDismiss(data, role);
     return this._nav.remove(this._nav.indexOf(this), 1, options).then(() => {
-      this._onDismiss && this._onDismiss(data, role);
+      this._onDidDismiss && this._onDidDismiss(data, role);
       return data;
     });
   }

src/components/popover/popover.ts

@@ -87,7 +87,7 @@ export class Popover extends ViewController {
  * To dismiss the popover after creation, call the `dismiss()` method on the
  * `Popover` instance. The popover can also be dismissed from within the popover's
  * view by calling the `dismiss()` method on the [ViewController](../../nav/ViewController).
- * The `onDismiss` function can be called to perform an action after the popover
+ * The `onDidDismiss` function can be called to perform an action after the popover
  * is dismissed. The popover will dismiss when the backdrop is clicked, but this
  * can be disabled by setting `enableBackdropDismiss` to `false` in the popover
  * options.

src/components/select/select.ts

@@ -320,7 +320,7 @@ export class Select {
     overlay.present(alertOptions);
 
     this._isOpen = true;
-    overlay.onDismiss(() => {
+    overlay.onDidDismiss(() => {
       this._isOpen = false;
     });
   }

src/components/toast/test/basic/index.ts

@@ -29,7 +29,7 @@ class E2EPage {
       message: 'User was created successfully'
     });
 
-    toast.onDismiss(() => {
+    toast.onDidDismiss(() => {
       console.log('Dismissed toast');
     });
 
@@ -50,7 +50,7 @@ class E2EPage {
       duration: 5000
     });
 
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
@@ -59,7 +59,7 @@ class E2EPage {
       message: 'I am dismissed after 1.5 seconds',
       duration: 1500
     });
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
@@ -70,12 +70,12 @@ class E2EPage {
       closeButtonText: 'Ok',
       position: positionString
     });
-    toast.onDismiss(this.dismissHandler);
+    toast.onDidDismiss(this.dismissHandler);
     toast.present();
   }
 
   private dismissHandler(toast: Toast) {
-    console.info('Toast onDismiss()');
+    console.info('Toast onDidDismiss()');
   }
 
 }

src/components/toast/toast.ts

@@ -103,7 +103,7 @@ export class Toast extends ViewController {
  * by passing the number of milliseconds to display it in the `duration` of
  * the toast options. If `showCloseButton` is set to true, then the close button
  * will dismiss the toast. To dismiss the toast after creation, call the `dismiss()`
- * method on the Toast instance. The `onDismiss` function can be called to perform an action after the toast
+ * method on the Toast instance. The `onDidDismiss` function can be called to perform an action after the toast
  * is dismissed.
  *
  * @usage
@@ -119,7 +119,7 @@ export class Toast extends ViewController {
  *     position: 'top'
  *   });
  *
- *   toast.onDismiss(() => {
+ *   toast.onDidDismiss(() => {
  *     console.log('Dismissed toast');
  *   });
  *