CODEWITHSUNDEEP
angulartypescriptionic-frameworkrxjs
Yushin
Yushin

Reputation: 1750

Argument of type 'MonoTypeOperatorFunction<any>' is not assignable to parameter of type 'UnaryFunction<Observable<any>, Observable<any>>'

i am trying to migrate from rxjs 5 to 6 but i am having difficulties. when i try this

this._connectivity.isOnline().pipe(first()).subscribe((state) => {
  this.syncCheck(user.uid);
});

i am getting this error

Argument of type 'MonoTypeOperatorFunction<any>' is not assignable to parameter of type 'UnaryFunction<Observable<any>, Observable<any>>'.
  Types of parameters 'source' and 'source' are incompatible.
    Type 'import("/home/User/Desktop/projectname/node_modules/rxjs/Observable").Observable<any>' is not assignable to type 'import("/home/User/Desktop/projectname/node_modules/rxjs/internal/Observable").Observable<a...'.
      Property 'map' is missing in type 'Observable<any>'.

Upvotes: 23

Views: 50879

Answers (6)

Torsten Barthel
Torsten Barthel

Reputation: 3458

A simple trick to solve such complicated typing issues is to just cast as any. In my case the error OP mentioned happend in Observable pipeline when using take(1). I just changed

.pipe(take(1))

to

.pipe(take(1) as any)

and the error was gone. Not the best way in a type safe way of thinking but really useful here and in general.

Upvotes: 0

Julio Cesar Brito Gomes
Julio Cesar Brito Gomes

Reputation: 810

I was having this same problem with the code below

mockDetalhes(): Observable<IResponseGenericPage>{
    return of(detalhesMock)
}

The issue was resolved by adding the type inside the of operator, like this:

mockDetalhes(): Observable<IResponseGenericPage>{
    return of(<IResponseGenericPage>detalhesMock)
}

Upvotes: 0

mpro
mpro

Reputation: 15050

I had similar error using pipe in one of HTTP services method (see example on the bottom). The problem was lack of typing in callback function used in subscribe. In your case, add typing (not the best idea but even any) to state or remove the parenthesis:

Solution 1:

this._connectivity.isOnline()
  .pipe(first()).subscribe((state: any) => {
    this.syncCheck(user.uid);
});

Solution 2:

this._connectivity.isOnline()
  .pipe(first()).subscribe(state => {
    this.syncCheck(user.uid);
});

Coming back to my case I've used pipe to log log the data. It required to set two possible types to the observable, then typing callback function was possible:

  public getPrice(): Observable<string | PriceDTO> {
    return this.http.get<PriceDTO>(`api/price)
      .pipe(
        tap((data: PriceDTO) => console.log('PRICE: ', data)),
        catchError((val: Error) => of(`I caught: ${val}`))
      );
  }

Upvotes: 4

lingar
lingar

Reputation: 603

I have such issue, first scan wasn't working, so I changed 

  .pipe(scan((count ) => count + 1, 0))...

To 

  .pipe(scan((count:any ) => count + 1, 0))

Then the problem also was that the Rxjs was installed also at the parent folder of this app. So removing this,I believe have fix the problem.

Using npm-check package is good idea for cleaning problem either global and local level of npm packages.

Upvotes: 2

Kamil Naja
Kamil Naja

Reputation: 6692

I found the same error with my code:

let source = of([1, 2, 3, 45, 56, 7, 7])
    .pipe(
        filter((x: number) => x % 2 == 0)
    );

TS2345: Argument of type 'MonoTypeOperatorFunction' is not assignable to parameter of type 'OperatorFunction'.

To fix this, remove type from filter function

 filter(x => x % 2 == 0)

Now you have error

The left-hand side of an arithmetic operation must be of type 'any', 'number', so make sure, that this annoying filter gets correct data type

filter(x => Number(x) % 2 == 0) // parse element to number

But now code stops work. Finally, to fix this, change of to from, at the beginning.

let source = from([1, 2, 3, 45, 56, 7, 7])
    .pipe(
        filter((x: number) => Number(x) % 2 === 0)
    )

or

let source = of(1, 2, 3, 45, 56, 7, 7)
.pipe(
        filter((x: number) => Number(x) % 2 === 0)
    )

So, cause of error was my initial data structure.

I think, that my example can help you with dealing similar problems.

Upvotes: 23

ggradnig
ggradnig

Reputation: 14169

You seem to have a wrong import for the isOnline() return type. Make sure that you always import from rxjs and never from rxjs/internal or even rxjs/internal/Observable. (Operators like first() must be imported from rxjs/operators)

Upvotes: 12

Related Questions