Argument of type 'unknown[]' is not assignable to parameter of type > 'OperatorFunction

user_1077309 0
Viewed 5034

component.ts

initialize() method says

Argument of type 'unknown[]' is not assignable to parameter of type 'OperatorFunction<unknown[], unknown>'. Type 'unknown[]' provides no match for the signature '(source: Observable<unknown[]>): Observable'

alertsChanged$: Observable<AlertModel[]>;

private initialize(): void {
  

    this.alertsChanged$ = this.alertsService.getAlerts().pipe(
      map((res) => res), // here it returns the above error
      tap((res) => {
        
        this.setDataForFilters(res); //Argument of type 'unknown' is not assignable to parameter of type 'AlertModel[]'.  
       
      }),          
    );
  }

 private setDataForFilters(alerts: AlertModel[]): void {}

service.ts

 // no issues here

 getAlerts(): Observable<AlertModel[]> {
      return this.angularFireDatabase
      .list<AlertModel>(`groups/${this.groupId}/alerts`)
      .valueChanges()
      .pipe(
        map((res) => orderBy(res, ['timeStamp'], ['desc'])),
        first()
      );
  }

.html

 <app-alerts
    [alerts]="alertsChanged$ | async"
  ></app-alerts>

Please let me the issue here?

angularfire rxjs ionic-framework angular typescript
2 Answers

I found the issue here. It was a conflict with the Lodash map and RxJS map. i.e. VS code didn't import the RxJS map due to the Lodash map and it gave the above error due to that.

Since I need to use both on the same component I have done it like so.

import { finalize, tap, map } from 'rxjs/operators';

import { map as lodashMap } from 'lodash';
user_10773090

The same kind of error will come if we use the imports from 'rxjs' and "rxjs/operators" at the same time. In my case this was the code,

  this.anApiCall.getAdata(this.id)
  .pipe(map(res => this.dataUtil.parseToForm(this.id, res)),
    onErrorResumeNext(of(this.dataUtil.newForm(this.id))))
  .pipe(tap(frm => this.form = frm))
  .subscribe();

I was using 'onErrorResumeNext' operator but unfortunately, IDE imported the function from 'rxjs' instead of rxjs/operators.

 import { onErrorResumeNext } from "rxjs"; // if the import is like this then you will get error like 'Argument of type 'Observable<YourType>' is not assignable to parameter of type 'OperatorFunction<unknown, unknown>'.'

So check the import is from 'rxjs/operators' or not. and change the import as

import { map, tap, onErrorResumeNext  } from "rxjs/operators";
user_55540700
Related