Rxjs from() operator doesn't send data

Question

I have a simple app on Angular/rxjs/Ngrx which requests list of default films from the api.

component.ts

export class MoviesComponent implements OnInit {
  private movies$: Observable<{}> = 
  this.store.select(fromRoot.getMoviesState);
  private films = [];

  constructor(public store: Store<fromRoot.State>) {}

  ngOnInit() {
    this.store.dispatch(new MoviesApi.RequestMovies());
    this.movies$.subscribe(film => this.films.push(film));
    console.log(this.films)
  }

effects.ts

  @Effect()
  requestMovies$: Observable<MoviesApi.MoviesApiAction> = this.actions$
    .pipe(
      ofType(MoviesApi.REQUEST_MOVIES),
      switchMap(actions => this.MoviesApiServ.getDefaultMoviesList()
        .pipe(
          mergeMap(movies => of(new MoviesApi.RecieveMovies(movies))),
          catchError(err => {
            console.log('err', err);
            return of(new MoviesApi.RequestFailed(err));
          })
        )
      )
    );

service.ts

export class MoviesApiService {
  private moviesList = [];

  constructor(private http: HttpClient) { }


  public getDefaultMoviesList(): Observable<{}> {
    DEFAULT_MOVIES.map(movie => this.getMovieByTitle(movie).subscribe(item => this.moviesList.push(item)));
    return from(this.moviesList);
  }

  public getMovieByTitle(movieTitle: string): Observable<{}> {
    return this.http.get<{}>(this.buildRequestUrl(movieTitle))
      .pipe(retry(3), 
        catchError(this.handleError)
      );
  }

}

DEFAULT_MOVIES is just array with titles.

So my getDefaultMoviesList method is not sending data. But if I replace this.moviesList to hardcoced array of values it works as expected. What I'm doing wrong?

UPD I wanted to loop over the default list of films, then call for each film getMovieByTitle and collect them in array and send as Observable. Is there any better solution?

Answer 1

You can try creating the observable using of operator.

Ex: of(this.moviesList);

One intersting fact to note is that Observable.of([]) will be an empty array when you subscribe to it. Where as when you subscribe to Observable.from([]) you wont get any value.

Observable.of, is a static method on Observable. It creates an Observable for you, that emits value(s) that you specify as argument(s) immediately one after the other, and then emits a complete notification.