# Sending event to app controller from service/components

**URL:** <https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667>\
**Category:** ionic-v3\
**Created:** [July 26, 2016, 5:35pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667 "2016-07-26T17:35:19Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Peekmo](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/peekmo/32/97270_2.png) [@Peekmo](https://forum.ionicframework.com/u/Peekmo)\
**Post date:** [July 26, 2016, 5:35pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667/1 "2016-07-26T17:35:19Z")

</div>

Hello,

I’m facing an issue that a lot of people have and debates on : I need to change the view when something happens in my service.

OK, broken design, I understood from many posts. But no solutions.

My problem :  
I have API calls, and when one of them failed with 401, I need to redirect the user to login page. All my API calls are in a provider, and (of course), I don’t want to handle that case in every controllers.  
I have also some angular2 components (@Component decorator) that are used in many places of the app, and they have link to other pages. But I can’t inject NavController in components (and components are part of the view isn’t it ?).

Some people said in old posts: “use events to send to controllers.” Ok. But how does it work ?

The only common piece of every call, is the “App” that bootstraps the application. How to send it an event through a @Component that is injected in deeper @Page, and in @Providers (and how to throw events in @Providers, that’s weird ?)

I (and I’ll probably not be the only one) will really appreciate a concrete example on how you can manage this kind of problems, 'cause I really don’t have a clean idea after many many days and tries.

Best regards,  
Peekmo

---

<div class="post-metadata">

**Author:** ![rapropos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/rapropos/32/100227_2.png) [@rapropos](https://forum.ionicframework.com/u/rapropos)\
**Post date:** [July 26, 2016, 8:41pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667/2 "2016-07-26T20:41:40Z")

</div>

One way to handle this is to have a service that contains an `Observable<boolean>` representing “are we authenticated?”. I use a `ReplaySubject` with a stack depth of 1. The app’s root page can inject `NavController`, subscribe to the authentication record service, and call `nav.setRoot` appropriately whenever a new state is entered. You can also employ similar logic in an attribute directive, if you want to go that way. When an API call gets a 401 error, you can call `next(false)` on the authentication recorder. When a login is successful, you call `next(true)` on it.

---

<div class="post-metadata">

**Author:** ![Peekmo](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/peekmo/32/97270_2.png) [@Peekmo](https://forum.ionicframework.com/u/Peekmo)\
**Post date:** [August 2, 2016, 8:35pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667/3 "2016-08-02T20:35:26Z")

</div>

Hi,

Thank you, it’s a good idea for services, but how to do that with components ?  
Is there an other way for components to modify navigation stack ?

---

<div class="post-metadata">

**Author:** ![luchillo17](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/luchillo17/32/78209_2.png) [@luchillo17](https://forum.ionicframework.com/u/luchillo17)\
**Post date:** [August 2, 2016, 9:06pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667/4 "2016-08-02T21:06:34Z")

</div>

Which version of ionic are you using? almost a month ago the `@Page` was deprecated and now we use `@Component` decorator.

Also why not putting all http calls in a single service and in there override the actions when a 401 status code is received to go to login, for example i have a service that wraps all http calls, add then the access token as well as some info like dbUrl and user company, i only tell it to add the headers inside that service while i call it all over the app, you could do the same, just add this to be able to use the nav controller in injectables:

```auto
class httpService {
  constructor(
    public app: App
  ) { ... }

  redirectToLogin() {
    let nav = this.app.getActiveNav()
    nav.setRoot(LoginPage);
  }
}

```

---

<div class="post-metadata">

**Author:** ![Peekmo](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/peekmo/32/97270_2.png) [@Peekmo](https://forum.ionicframework.com/u/Peekmo)\
**Post date:** [August 3, 2016, 4:52pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667/5 "2016-08-03T16:52:40Z")

</div>

In fact, the migration solved my issue.

Thank you !

---

<div class="post-metadata">

**Author:** ![luchillo17](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/luchillo17/32/78209_2.png) [@luchillo17](https://forum.ionicframework.com/u/luchillo17)\
**Post date:** [August 3, 2016, 9:33pm UTC](https://forum.ionicframework.com/t/sending-event-to-app-controller-from-service-components/58667/6 "2016-08-03T21:33:31Z")

</div>

Wow how did you put that solution checkmark? i didn’t know that existed.