menu

Ionic Popup


Ionic Popup: Popups are great ways to draw user’s attention and get some information from the user or provide some information. Ionic Popup service enables you to create popup windows which need some action from the user to continue. Basically, there is three main popups alert box, confirm box and prompt box. The service $ionicPopup is used for creating the popups. Here in this tutorial, we are going to explain the popup step by step with example and demo.


Ionic Popup

There are the following popups available in Ionic, Now let us go one by one-

Ionic Alert Box

To create alert box in ionic the service $ionicPopup is used which is imported in controller. $ionicPopup.alert() creates the alert box.

Alert Box : Js Controller Code

Ionic Popup Alert Box:

Alert Box : Html Part :

Html Part contains the following code-

Ionic Popup Alert Box:

Try it »

If you run the above example it will produce the output something like this –

Ionic popup Alert Box example demo

Ionic Confirm Box

$ionicPopup Service is used to create confirmation box in Ionic which needs to be imported in controller before using it. $ionicPopup.confirm() creates the confirm box.

Confirm Box : Js Controller Code

Ionic Popup Confirm Box:

Confirm Box : Html Part :

Ionic Confirm Box:

Try it »

If you run the above example it will produce the output something like this –

Ionic confirm box example & demo

Ionic Show Popup

$ionicPopup service must be imported in controller before using it. $ionicPopup.show() is used to created Show popup in ionic.

Show Popup Box : Js Controller Code

Here is the complete controller part of Show Popup-

Ionic Show Popup Box Example:

Show Popup Box : Html Part :

Ionic Show Popup Box:

Try it »

If you run the above example it will produce the output something like this –

Ionic Show Popup

Advertisements