Question

我正在使用Angular（5）创建一个应用程序，而且我不是很熟练使用Subject。我想在我的组件中捕获Observable错误，但我不能这样做。这是我的代码

我的模特： 示例-model.ts

export class ExampleModel { 
    public value: string; 
}

我的服务： 示例模型服务

@Injectable()
export class ExampleModelService implements OnDestroy{

  destroy$: Subject<boolean> = new Subject<boolean>();
  private exampleModel$ = new ReplaySubject<ExampleModel>(1);

  constructor() { }

  exampleModelInit(){
    //Observable.from([{'value': 'Hello World'}])
    Observable.create(sub => sub.error('Observable Error'))
      .pipe(
        distinctUntilChanged(),
        takeUntil(this.destroy$)
      )
      .subscribe((exampleModel: ExampleModel) => {
        this.sendExampleModel(exampleModel);
      },
        err => this._handleError(err));
  }

  private _handleError(err: any) {
    return Observable.throw(err);
  }

  private sendExampleModel(exampleModel: ExampleModel) {
    this.exampleModel$.next(exampleModel);
  }

  public whenExampleModel(): Observable<ExampleModel> {
    this.exampleModelInit();
    return this.exampleModel$.asObservable();
  }

  ngOnDestroy() {
    this.destroy$.next(true);
    this.destroy$.unsubscribe();
  }
}

我的组件：的家庭component.ts

export class HomeComponent implements OnInit, OnDestroy {

  public exampleModel$: Observable<ExampleModel>;

  public unsubscribe$: Subject<boolean> = new Subject<boolean>();

  controls: boolean = false;
  indicators: boolean = false;

  constructor(private exampleModelService$: ExampleModelService) {
  }

  ngOnInit() {
  }

  getExampleModel() {
    this.exampleModel$ = this.exampleModelService$.whenExampleModel();

  }

  ngOnDestroy(): void {
    this.unsubscribe$.next(true);
    this.unsubscribe$.unsubscribe();
  }

}

我希望在getExampleModel()中抓住我的错误，我尝试使用.catch但没有结果。

由于

Answer 1

尝试返回一个返回this.exampleModel $;而不是返回this.exampleModel $ .asObservable（）;在whenExampleModel服务方法中。

无论如何，我喜欢知道你想做什么。你能写在这里吗？

试试这个！

exampleModelInit(){
//Observable.from([{'value': 'Hello World'}])
Observable.create(sub => sub.error('Observable Error'))
  .pipe(
    distinctUntilChanged(),
    takeUntil(this.destroy$)
  )
  .subscribe((exampleModel: ExampleModel) => {
    this.sendExampleModel(exampleModel);
  },
    err => this.sendExampleModel(exampleModel);

}

Answer 2

第一个问题是你使用异步方法作为执行时返回值的普通方法。

然后，我们需要做的第一个更改是在this.exampleModelService $ .whenExampleModel（）;中捕获错误的移动逻辑;方法

whenExampleModel（）方法必须向使用者返回一个observable才能获得异步结果。 异步结果是未来的结果，但不可用

尝试更改此

    @Injectable()
export class ExampleModelService implements OnDestroy{

  destroy$: Subject<boolean> = new Subject<boolean>();
  private exampleModel$ = new ReplaySubject<ExampleModel>(1);
  private obs : Observable<ExampleModel>;

  constructor() { }

  exampleModelInit(){
    //Observable.from([{'value': 'Hello World'}])
    this.obs = Observable.create(sub => sub.error('Observable Error'))
      .pipe(
        distinctUntilChanged(),
        takeUntil(this.destroy$)
      );
  }

  private _handleError(err: any) {
    return Observable.throw(err);
  }

  private sendExampleModel(exampleModel: ExampleModel) {
    this.exampleModel$.next(exampleModel);
  }

  public whenExampleModel(): Observable<ExampleModel> {
    this.exampleModelInit();
    return this.obs;
  }

  ngOnDestroy() {
    this.destroy$.next(true);
    this.destroy$.unsubscribe();
  }
}

<强>组件

whenExampleModel.subscribe（S =＆GT; {}，E =＆GT; {}）;

Angular - 组件中的Catch错误

2 个答案: