Ionic Backdrop


Ionic Backdrop : It shows the overlay above the content and below the popups, loading and other overlays. Method $ionicBackdrop.retain() and $ionicBackdrop.release() is used for backdrop in ionic. $ionicBackdrop.retain() is used to apply overlay over the content. $ionicBackdrop.release() is used to remove Ionic Backdrop from the content. Each time when $ionicBackdrop.retain() is called the $ionicBackdrop.release() method is also called. Here we are going to explain the ionic backdrop functionality with example and demo.


Ionic Backdrop

Here is syntax and example of ionic Backdrop-

Ionic Backdrop example

Try it ยป

Note : $ionicBackdrop service is mandatory before using. Make sure you have imported it.

You first need to import service of backdrop in controller then create a function which contains the ionic retain and release method. if you run the above example it will produce the following output –

Ionic Backdrop Example

More About Ionic Backdrop

Let us have more example of Ionic Backdrop.

Ionic Execute Action on Backdrop Disappear/Hidden

You Can Execute Action on backdrop disappear event as below –

Action on Backdrop Disappear/Hidden

Ionic Execute Action on Backdrop Appear/Show

You Can Execute Action on backdrop Appear event as below –

Ionic Execute Action on Backdrop Appear/Show

Note : $rootScope service is required for the Action on backdrop appear/disappear..