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?
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';
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";