Angular RxJS Observable loading error

Question

I have declared an observable variable

workOrders: Observable<IWorkOrders[]>;

And then i load that observable this way.

  this.bs.getWorkOrders()
  .pipe(map(data:IWorkOrders[]) => this.workOrders = data)),
    .subscribe((data: IWorkOrders[]) =>
      // this.workOrders = data;
      this.woSubject.next(data),
  );

but when i do it i see a red squiggly under the this.workOrders = data line. And also when I hover it says [ts] Type 'IWorkOrders[]' is not assignable to type 'Observable'

Antoniossss · Accepted Answer · 2018-05-26 16:56:59Z

1

workOrders=this.bs.getWorkOrders(); will work

workOrders is of type Observable. data is of type IWorkOrders[] Since those are 2 different types, thus error you are getting. You cannot assign IWorkOrders[] to Observable.

edited May 26, 2018 at 16:56

answered May 26, 2018 at 16:35

Antoniossss

32.7k7 gold badges67 silver badges119 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Antoniossss Over a year ago

@Sumchans 2 different types - thus error - iv edited answer.

Sumchans Over a year ago

so you saying if i declare this way workOrders:IWorkOrders, i can call it like this from my component this.bs.getWorkOrders().subscribe.

Antoniossss Over a year ago

Yep you can if you rly need Obeservable in your component insteed of emited value.

Sumchans Over a year ago

Okay thanks, still new to angular & observables, totally confusing concepts.

Antoniossss Over a year ago

Observable is littlebit like plain old listener pattern + streams

Tsvetan Ganev · Accepted Answer · 2018-05-26 16:55:44Z

1

As the error message states - workOrders is of type Observable<IWorkOrders[]>, while the data variable is of type IWorkOrders[]. In your case you are trying to assign two incompatible types to one another. In the map function you are receiving the value of the Observable which is of type IWorkOrders[].

What you have to do, is to declare workOrders as an IWorkOrders[] instead of an Observable of that type:

workOrders: IWorkOrders[];

P.S. you have an extra trailing comma .pipe(map(data:IWorkOrders[]) => this.workOrders = data)), <--

edited May 26, 2018 at 16:55

answered May 26, 2018 at 16:24

Tsvetan Ganev

8,9164 gold badges32 silver badges45 bronze badges

4 Comments

Sumchans Over a year ago

I tried that it worked that way, then how do i subscribe to the workOrders variable from another component if it is not an observable.

Tsvetan Ganev Over a year ago

There are many different ways to pass data to other components, depending on what exactly you want to achieve.

Sumchans Over a year ago

Doesn't it have to be an observable for me to subscribe from other components

Tsvetan Ganev Over a year ago

Please explain what you want to do because it's not clear by looking at just 3 lines of code with no context.

Collectives™ on Stack Overflow

Angular RxJS Observable loading error

2 Answers 2

5 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related