2

I am trying to call component method from service class, but I am getting an error like 'ERROR TypeError: Cannot read property 'test' of undefined'. But I went through similar kind of issues but there mostly explaining about component to component calling, so I am not understanding properly.

Example: Testcomponent.ts

@Component({
  selector:'component'
})
export class Testcomponent{

  test(){ 
    console.log('test method');
  }
}
Testservice.ts 

@Injectable()

export class Testservice {

private testcomp: Testcomponent;

// service method
dummy(){
  //trying to call component method
  testcomp.test();
  }
}

This is the how I am calling, I am not sure this is correct approach or not, So can any one plz me to understand how to call component method from service.

I went through this ref in stack but not getting what exactly doing How to call component method from service? (angular2)

Roy
  • 880
  • 7
  • 21
  • 39
  • *I am not sure this is correct approach or not*: it's not. Components call services. Not vice-versa. If you explained what concrete you're trying to solve, we could probably help you do it in a better way. – JB Nizet Aug 27 '19 at 06:30
  • 1
    It's not the correct way to do. Services are meant to be called from component or from another service. Why do you need to call a component method from service? – Ansuman Aug 27 '19 at 06:34
  • @JBNizet Ohh If this approach is not correct, then I will try in another way to get it done. Actually In service some logical stuff I had implemented..Thanks for giving clarity. – Roy Aug 27 '19 at 06:36
  • I just updated the response of @Tudor in the same post https://stackoverflow.com/questions/40788458/how-to-call-component-method-from-service-angular2/57669031#57669031. You see: 1.- a service has a observable and a method., 2.- the main subscribe to the observable, 3.-another component call to the method of the observable that makes "observable change" – Eliseo Aug 27 '19 at 06:49
  • This is not a right approach. You can use multiple services and it can call from another service. Services are used for component to component interaction. You need to inject service in order to use it in any component. – Kevin Jose Aug 27 '19 at 06:58
  • Service should be stateless and component should call service. – Saima Haji Aug 27 '19 at 07:56

2 Answers2

2

Try the following code. For reference visit https://angular.io/guide/component-interaction#parent-and-children-communicate-via-a-service

export class Testcomponent {

  constructor(private testService: Tesetservice) {
    this.testService.testComponent$.subscribe(res => {
      this.test()
    })
  }

  test() {
    console.log('test method');
  }
}

export class Testservice {

  private testComponentSource = new Subject<boolean>();

  // Observable string streams
  testComponent$ = this.testComponentSource.asObservable();


  // service method
  dummy() {
    //trying to call component method 
    this.testComponentSource.next(null);
  }
}
Ammar Hussain
  • 294
  • 2
  • 13
1

You should import subject like this and should emit your value from service using next.

@Injectable()
import { Subject } from 'rxjs';

export class Testservice {

  messageSubject = new Subject();


// service method
dummy(){
      this.messageSubject.next('hello from service'); // emit event
  }
}

And subscribe to the event in your component like this:

@Component({
  selector:'component'
})
import {Testservice}  from 'testservice';
export class Testcomponent{
        constructor(private testservice:Testservice) {  // import service
   }

  test(){ 
  this.testservice.messageSubject.subscribe((message)=>{
   console.log(message);
    });

  }
}
Tushar Dave
  • 11
  • 1