-2

I have an Injectable Class and a Component class. All I need to do is to call a function in the Component Class from the Injectable class.

INJECTABLE:

Injectable()
export class theInjected 
{

    constructor(private afAuth: AngularFireAuth, private googlePlus: GooglePlus, public alertCtrl: AlertController){

      this.afAuth.authState.subscribe(user => 
        {
          if(user) 
          {
            this.user = this.afAuth.authState; //this means alert('fire user logged in');

         //
         // I need to call the function here goTopage();
         //

          }
          else
          {
            Observable.of(null); //this means alert('fire user logged out');
          }
        }
      );
    }
}

COMPONENT:

@Component({
selector: 'home',
  templateUrl: 'home.html'
})

export class Home
{


constructor(public injected: theInjected){

}

  goTopage()
  {   
    this.navCtrl.setRoot(this.loggedInPage);
  }
}

I simply want a way to call a function existing in a component class from a Injectable.

Thanks!

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
JamesAnd
  • 410
  • 1
  • 8
  • 28
  • Possible duplicate of [How to call component method from service? (angular2)](https://stackoverflow.com/questions/40788458/how-to-call-component-method-from-service-angular2) – Jota.Toledo Nov 11 '17 at 17:13
  • Not a duplicate, this is a different approach trying Gunter suggestion now! – JamesAnd Nov 11 '17 at 17:20
  • Possible XY problem. It's not obvious why goTopage should be defined in a component and not a service. – Estus Flask Nov 11 '17 at 17:28
  • @estus because it should be in a component. this.navCtrl.setRoot(this.loggedInPage); does not have any effect (does not change the page) in case its used in the Injectable... It must be used n the component itself. – JamesAnd Nov 11 '17 at 17:35
  • 1
    This is not an explanation. If it must be used in a component, it can be defined in a service that is injected to a component. – Estus Flask Nov 11 '17 at 17:41
  • @estus I'm open for suggestions! can you please elaborate more or guide me towards an example? this maybe: https://stackoverflow.com/questions/43450259/angular-2-conditionally-inject-service-in-component ? – JamesAnd Nov 11 '17 at 17:47
  • Can you explain your case further and provide http://stackoverflow.com/help/mcve ? The things that matter here is where theInjected is used except Home, where loggedInPage comes from and if goTopage is supposed to be used anywhere else. There's a good chance that it can be done better than existing answer explains. – Estus Flask Nov 11 '17 at 17:59

1 Answers1

1

Use an observable and subscribe to it in the component.

export class theInjected 
{
  observable = new BehaviorSubject();

  someMethod() {
    this.observable.next('foo');
  }
}

export class Home
{


constructor(public injected: theInjected){
  injected.observable.subscribe(val => this.Topage());    
}

  goTopage()
  {   
    this.navCtrl.setRoot(this.loggedInPage);
  }
}
Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • The function goTopage() is being called from custructor even before the value changing (before this runs this.observable.next('foo'); ) ` injected.observable.subscribe(val => this.goTopage()); ` – JamesAnd Nov 11 '17 at 18:30
  • You can replace `BehaviorSubject` with `Subject` if you don't want that behavior. `BehaviorSubject` immdiatly emits it's current value to new subscribers. This helps avoiding timing issues when an event is emitted, before the receiver had a chance to subscribe. – Günter Zöchbauer Nov 11 '17 at 19:06
  • Hello, I did as implemented however its not calling the function goToPage() here is the code, in the **home.ts constructor**: `injected.observable.subscribe(val => this.goTopage());` **theInjected** in the end of the code where it needs to be called: `this.observable.next('a');` and its defined as `observable = new Subject(); ` – JamesAnd Nov 12 '17 at 00:28