June 20, 2016

Ionic 2 use NavController in Service to show Alerts

Usually you inject Nav:NavController into your classes constructor to use it:

But if you are working in a service you will receive the following error:

If you want to show alerts from within a service you are required to use the NavController.  To do so simply create the private field nav with type NavController. Then use the app.getActiveNav method provided by ionic-angular. See the snippet below for a full example:

Now you can show dialogs and alerts from a service in Ionic 2. But keep in mind, this is not good practice – services should not be tied to the UI of your application.

Related Posts

Can Kattwinkel
Developer at thecodecampus </>


28 responses to “Ionic 2 use NavController in Service to show Alerts”

  1. Alugbin Abiodun says:

    Please can we get the javascript version?? it keeps giving no provider for App!!

  2. Can Kattwinkel says:

    Hello Alugbin Abiodun,

    first of all – developing a Ionic 2 app with JavaScript is a BIG mistake. Take 3 days to learn the necessary TypeScript it will save you way more time.

    However you should be able to use app.getActiveNav(); in JavaScript as well, just follow the imports in the code snippet. I couldn’t setup a JavaScript App with ionic since the startup repositories are now fully in TypeScript.

  3. Brock Ellis says:

    Hi there!

    This blog post was very helpful!

    I have an ErrorService that I was using to catch errors thorough the application and display an alert. I know that this is bad practice (as stated by many other blogs as well) but I have never seen a good example of error handling and display?

    Where should the error UI (AlertController and such) go? How could you set up a global error class to be reusable between all components, if that’s even possible.

    Thanks so much for your help!

  4. Venkata says:

    The nav.present method I do not see in the ionic2 now. was that removed?
    Can you please explain any other way I can do that?

  5. Thanks man, it worked here!

  6. Chikku says:

    Thank you great explanation!

  7. Andrey says:

    Thank you so much! This is solution for my problem!

  8. zuan says:

    Thank you for the useful update For beginners and start your career in Ionic.

  9. shreyaz says:

    Thanks for giving error and nav controller code. These code are usefull ionic developer.

  10. aruna ram says:

    Nice Blog! Thanks for providing the knowledgeable content, it was a great post to developing my skills. Well done…!

  11. Very interesting and useful information, thanks for sharing with us, keep up the good work!

  12. Nice Blog! Thanks for providing the knowledgeable content

  13. Very Nice!! Thanks for Sharing..

  14. Gautami says:

    Very Nice!! Thanks for Sharing..

  15. Very Usefull Infoemation!! Thanks

  16. Thanks for giving useful Information….

  17. Nice Blog!!!! Thanks for sharing this with us.

  18. Recruitment Consultants says:

    Great, thanks for sharing.

  19. Tremendous blog quite easy to grasp the subject since the content is very simple to understand. Obviously, this helps the participants to engage themselves in to the subject without much difficulty. Hope you further educate the readers in the same manner and keep sharing the content as always you do.

  20. Stupendous blog huge applause to the blogger and hoping you to come up with such an extraordinary content in future. Surely, this post will inspire many aspirants who are very keen in gaining the knowledge. Expecting many more contents with lot more curiosity further.

  21. Soclikes says:

    Thank you for sharing this! I learn how to use ionic 2 now

  22. Viplikes says:

    Vielen Dank für dieses Beispiel! Es hat mir geholfen

  23. Really wonderful blog completely enjoyed reading and learning to gain the vast knowledge. Eventually, this blog helps in developing certain skills which in turn helpful in implementing those skills. Thanking the blogger for delivering such a beautiful content and keep posting the contents in upcoming days.

  24. Truly incredible blog found to be very impressive due to which the learners who ever go through it will try to explore themselves with the content to develop the skills to an extreme level. Eventually, thanking the blogger to come up with such an phenomenal content. Hope you arrive with the similar content in future as well.

  25. Highly appreciable regarding the uniqueness of the content. This perhaps makes the readers feels excited to get stick to the subject. Certainly, the learners would thank the blogger to come up with the innovative content which keeps the readers to be up to date to stand by the competition. Once again nice blog keep it up and keep sharing the content as always.

  26. Wonderful blog found to be very impressive to come across such an awesome blog. I should really appreciate the blogger for the efforts they have put in to develop such an amazing content for all the curious readers who are very keen of being updated across every corner. Ultimately, this is an awesome experience for the readers. Anyways, thanks a lot and keep sharing the content in future too.

Leave a Reply

Add code to your comment in Markdown syntax.
Like this:
`inline example`

```
code block
example
```

Your email address will not be published.