在其他服务Angular 2中注入服务的问题

Question

在另一个服务中注入服务时遇到问题。 我有一个 ContactService 使用 handleError 方法从服务器获取数据。 我有一个 AlertService 从 handleError 方法抛出错误。 我已经在我的核心模块中声明了contactService 和AlertService。 但是当我调用 alertService.submitNewMessage 时，它​​显示 this.alertService 是未定义的。 请帮忙

@Injectable()
export class AlertService {
  private $currentMessages: BehaviorSubject<string> = new BehaviorSubject('');
  public currentMessages: Observable<string> = this.$currentMessages.asObservable();
  constructor() { }

  submitNewMessage(msg: string): void {
    this.$currentMessages.next(msg);
  }

}

并联系服务

@Injectable()    
export class ContactService {


      private contactsUrl = 'http://localhost/customers';
      constructor(
                  private http: Http,
                  private router: Router,
                  private alertService: AlertService
                  ) { }

      getContactsFromService(): Observable<SubmitCustomerHttp[]>  {
        return this.http.get(this.contactsUrl)
                        .map(this.extractData)
                        .catch(this.handleError);
      }

      private extractData(res: Response) {
        return HttpHelper.extractData(res);
      }

      handleError(error: Response | any) {
        let errMsg: string;
        console.log('Receive error: ', error);
        if (error instanceof Response) {
          const body = error.json() || '';
          const err = body.error || JSON.stringify(body);
          errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
          if (error.status === 500 || 400 || 404) {
            window.alert(errMsg);
            this.alertService.submitNewMessage(errMsg);
            return errMsg;
          }
        } else {
          errMsg = error.message ? error.message : error.toString();
          console.log('Error Message: ', errMsg);
          return null;
        }
      }
    }

我的核心模块

@NgModule({
  imports: [
    CommonModule,
    HttpModule,
    JsonpModule

  ],
  declarations: [],
  providers: [
    AlertService,
    ContactService,

  ]
})


export class CoreModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: CoreModule,
      providers: [
        AlertService,
        ContactService,

      ]
    };
  }
}

Answer 1

我怀疑的问题与

有关

return this.http.get(this.contactsUrl)
                .map(this.extractData)
                .catch(this.handleError);

这会将类方法注册为回调，这是不正确的，因为this 不会正确绑定。

您可以通过将它们包装在箭头函数中来解决此问题，这样当到达内部代码时，this 仍将引用服务而不是回调函数：

return this.http.get(data => this.contactsUrl(data))
                .map(data => this.extractData(data))
                .catch(data => this.handleError(data));