【问题标题】:rxjs - ngrx - execute multiple operators together(parallel) and dispatch multiple actions in parallelrxjs - ngrx - 一起(并行)执行多个运算符并并行调度多个操作
【发布时间】:2021-05-10 21:56:01
【问题描述】:

在获得 api 结果并分派PlanningPreviewSuccess 操作后,我需要对结果进行分组并分派另一个其有效负载接受分组结果的操作 怎么做?使用巫婆 rxjs 运算符?

@Effect()
    fetchElencoTicket$ = this.actions$
        .pipe(
            ofType(ActionTypes.PLANNING_PREVIEW_FETCH),
            mergeMap((action: PlanningPreviewFetch) => {
                const {Inizio, Fine, Comune, Attivita} = action.request;
                return this.planningSrv.GetPlanningPreview(Inizio, Fine, Comune, Attivita);
            }),
            map(plannigPreviewResult => { 
                console.log("plannigPreviewResult", plannigPreviewResult);
                return new PlanningPreviewSuccess(plannigPreviewResult);
            }),
            catchError(err => of(console.log("ERROR"),
                new GenericShowSnackBar({ icon: 'error_outline', text: err.error ? err.error.Message : err, duration: 3000 })
            ))
        );

【问题讨论】:

    标签: angular rxjs ngrx


    【解决方案1】:

    我不确定我是否正确理解了您的问题,但如果您想合并 2 个或更多 observables 并单独想要它们的订阅结果,您可以使用 combineLatest 运算符。使用方法如下:

    // Usage of combineLatest
    
    let observable1$ = this.yourObservable1;
    let observable2$ = this.yourObservable2;
    
    combineLatest(
        observable1$,
        observable2$
    ).pipe(
        filter(data => !!data), 
        tap(data => console.log(data)) 
        catchError(error => console.log(error))
    ).subscribe(
      [dataFromObservable1, dataFromObservable2] => {
       // This will subscribe only if all the observables return data
       // Otherwise it will go to catchError
    })
    
    
    // Filter will check if the data is present or not.
    // Tap will return the data before subscribing
    // catchError ==> Subscription errors are caught in this catchError
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多