Learning Ionic - Second Edition

Modals

In this section, we will take a look at modals in Ionic and how to implement them. To work with this example, we scaffold a new project:

ionic start -a "Example 6" -i app.example.six example6 blank --v2

cd into example6 folder and run ionic serve --lab, and you should see the homepage of blank template.

To work with modals, we need to first create a component that we want to display as a modal.

From inside the example6 folder, run the following:

ionic generate component helloModal

Note: We will look at sub-generators at a later point in this chapter.

Note: If you are using the latest Ionic CLI, you will see a file named hello-modal.module.ts generated along with the hello-modal.html, hello-modal.scss, and hello-modal.ts. To know ...