Skip to content

Commit

Permalink
Update modal-controller.ts
Browse files Browse the repository at this point in the history
I added documentation on how to use a modal container component in an Ionic app. This has had a lot of discussion in ionic-team#8151, and is minimally documented, so I took a stab at documenting it.
  • Loading branch information
wbhob committed Aug 25, 2017
1 parent 26b09f1 commit 7aace2f
Showing 1 changed file with 19 additions and 0 deletions.
19 changes: 19 additions & 0 deletions src/components/modal/modal-controller.ts
Expand Up @@ -112,6 +112,25 @@ import { DeepLinker } from '../../navigation/deep-linker';
*
* }
* ```
*
* A common issue is that a developer may try to implement navigation in a modal, but when you try NavController.push(),
* you will notice that the status bar on iOS gets cut off. The proper way to implement navigation in a modal is to
* make the modal component a navigation container, and set the root page to the page you want to show in your modal.
*
* ```ts
* @Component({
* template: '<ion-nav [root]="rootPage" [rootParams]="rootParams"></ion-nav>'
* })
* export class MyModalWrapper {
* rootPage = 'MyModalContentPage'; // This is the page you want your modal to display
* rootParams;
*
* constructor(navParams: NavParams, private viewCtrl: ViewController) {
* this.rootParams = Object.assign({}, navParams.data, {viewCtrl: viewCtrl});
* // This line will send the view controller into your child views, so you can dismiss the modals from there.
* }
* }
* ```
* @demo /docs/demos/src/modal/
* @see {@link /docs/components#modals Modal Component Docs}
*/
Expand Down

0 comments on commit 7aace2f

Please sign in to comment.