CODEWITHSUNDEEP
angularrxjsrxjs-observables
Ian Vink
Ian Vink

Reputation: 68750

RxJS Observables: Creating with values

I don't yet have the service to call for the values, so I am doing some boiler plate code with aysnc ngFors.

I am trying to create an obserable that can be consumed by an ngFor. I try:

 statuses$ = Observable.create((o) => {
    o.next(new NameValue('Open', 'OPEN'));
    o.next(new NameValue('Closed', 'CLOSED'));
    o.complete();
  });

then

        <mat-option *ngFor="let status of statuses$ | async" [value]="status.value">
          {{ status.name }}
        </mat-option>

but I get an Async error

Cannot find a differ supporting object '[object Object]' of type 'Open'. NgFor only supports binding to Iterables such as Arrays

Upvotes: 0

Views: 38

Answers (1)

wlf
wlf

Reputation: 3393

Simulate your observable like this:

import { of } from 'rxjs';    

statuses$ = of([new NameValue('Open', 'OPEN'), new NameValue('Closed', 'CLOSED')]);

which gives an array that *ngFor can interpret, rather than the object you are returning currently.

Upvotes: 3

Related Questions