switchMap gives error type 'void' is not assignable to type 'ObservableInput

Question

I have a variable queryCode of type string that depends on the value of route params so it is set under subscribe of activated route params and then using that value if it's null or not I call several other services.

I tried to use switchMap since other pieces of codes are dependent on queryCode but I'm getting the error Argument of type '() => void' is not assignable to parameter of type '(value: Params, index: number) => ObservableInput<any>'. Type 'void' is not assignable to type 'ObservableInput<any>'.

Can somebody help me please?

this.route.queryParams
      .pipe(
        takeUntil(this.unsubscribe$),
        tap(queryParams => {
          this.queryCode = this.filterService.getCodeBasedQueryParams(queryParams); // this returns a string
        }),
        switchMap(() => {
          if (this.queryCode) {
            
            this.productService.dataLoaded$.subscribe((arrows: IAuctionArrows) => {
               /// some code 
            });
            this.productService.codeClosed$
              .subscribe(() => 
                 this.productService.loadNextCode(this.queryCode));
          }
        }),
        switchMap( () => {
          this.productService.userLoaded$
            .subscribe(product => {
              this.typeOfProduct = this.product-service.getProductType(product);
              if (this.queryCode && this.typeOfProduct) {
                 //some code
              }
              this.currentId = product.id;
              this.router.navigate(['/product/' + this.currentId], { queryParamsHandling: 'preserve' });
            });
        }),
      )
      .subscribe();

Previously I had this, but this is not reliable since if the query code is set in async block and I do the checks without making sure that its value is set.

ngOnInit() {

this.route.queryParams.subscribe( params => {
    this.queryCode = 
             this.filterService.getCodeBasedQueryParams(queryParams); // this returns a string
})



if (this.queryCode) {
            
   this.productService.dataLoaded$
           .subscribe((arrows: IAuctionArrows) => {
               /// some code 
            });
            this.productService.codeClosed$
              .subscribe(() => 
                 this.productService.loadNextCode(this.queryCode));
}



this.productService.userLoaded$
            .subscribe(product => {
              this.typeOfProduct = this.product-service.getProductType(product);
              if (this.queryCode && this.typeOfProduct) {
                 //some code this.currentId set here
              }
              this.currentId = product.id;
              this.router.navigate(['/product/' + this.currentId], { queryParamsHandling: 'preserve' });
            });

}

to get rid of ts errors, replace both `switchMap` operators with `tap`. to implement everything correctly you should learn rxjs on easier examples to understand how it works — Andrei, Oct 09 '22 at 19:29
@Andrei how can I make it work with `switchMap`? Since it will cancel all calls when having new param. And that is what I need — oescc, Oct 09 '22 at 19:44
you should return observable inside of a siwtchMap callback `switchMap(( => data$)` which it will subscribe on after recieving the event — Andrei, Oct 09 '22 at 19:45
@Andrei but as you can see on that piece of code, I do have one or two calls inside `if blocks` so I can't return a observable — oescc, Oct 09 '22 at 19:46
@Andrei I added the piece of code that I had before trying with `switchMap` so maybe you can understand my problem — oescc, Oct 09 '22 at 19:52
You need to return an Observable from the project function in all your `switchMap`s — martin, Oct 10 '22 at 07:39
can you give me an example with my code @martin cause I don't know exactly how to handle if conditions — oescc, Oct 10 '22 at 07:49

switchMap gives error type 'void' is not assignable to type 'ObservableInput

0 Answers0