How can i emit a string in service and get in component

Question

I want to emit a string when the util.service.ts handled some errors, so that i can get this message in app.component.ts and show it, but i can not subscribe the emitter. this is my code, but it do not work:

in util.service.ts:

export class UtilService {
  errMsgEmitter = new EventEmitter();
  private handleError(error: Response | any) {
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body['error'] || JSON.stringify(body);
      errMsg = `${error['status']} - ${error['statusText'] || ''} ${err}`;
    } else {
      errMsg = error['message'] ? error['message'] : error.toString();
    }
    console.error(errMsg);
    this.errMsgEmitter.emit(errMsg);
    return Observable.throw(errMsg);
   }
  /**
   * get event emitter
   * @returns {EventEmitter<any>}
   */
  getNavChangeEmitter() {
    return this.errMsgEmitter;
  }

in app.component.ts i have this:

ngOnInit() {
  this.utilService.getNavChangeEmitter()
   .subscribe(data => {
     this.errMsg = data;
   });
  }

Can anybody help me? Thanks a lot

@AJT_82 handleError is called in a base http service when anyone who need http services thanks — Russell Abraham, May 29 '17 at 11:32

score 0 · Answer 1 · answered May 27 '17 at 09:35

You can use Subject as Observable as below.

import { Subject }    from 'rxjs/Subject';

export class UtilService {
  private message = = new Subject<string>();

  public errorMessage$ = this.message.asObservable();
  private error: string = '';

  private handleError(error: Response | any) {
    this.error = '';
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body['error'] || JSON.stringify(body);
      this.error = `${error['status']} - ${error['statusText'] || ''} ${err}`;
    } else {
      this.error = error['message'] ? error['message'] : error.toString();
    }
    console.error(this.error);
    this.message.next(this.error);
  }
}

// app.component.ts

ngOnInit() {
  this.utilService.errorMessage$.subscribe(error => {
    this.errMsg = error;
  });
}

I've tried this way, but I can not subscribe the Subject either — Russell Abraham, May 27 '17 at 12:58

score 0 · Accepted Answer · answered May 30 '17 at 15:31

Suddenly I resolved this by make a static Subject:

util.service.ts:

static errSubject: BehaviorSubject<any> = new BehaviorSubject<any>('');

app.component.ts:

    UtilService.errSubject
      .subscribe(data => {
        this.errMsg = data;
      });

and do not forget provide UtilService in app.module.ts

How can i emit a string in service and get in component

2 Answers2