Angular NgRx Getting information from API

Question

I'm trying to put the information that comes from the api when doing an omdb search and put it in the scope of NgRx in angular 13.

below is the code of which I am trying to insert the scope but it accuses the error "Type 'Movie' is missing the following properties from type 'Observable<Movie[]>': source, operator, lift, subscribe, and 3 more."

export class MovieSearchComponent implements OnInit {
  
  movies$: Observable<Movie[]>;
  Title = new FormControl;

  constructor(private movieService: MovieService, private store: Store<MovieState>) { 
    this.movies$ = this.store.pipe(select(selectMovies));
  }

  ngOnInit(): void {
  }

  getMovie(): void {

    this.movieService.getMovie(this.Title.value).subscribe(
      movie => {
        this.movies$ = movie
      }
    )
  }

}

Answer 1

The issue should be in this line

this.movies$ = movie

the type of this.movies$ is Observable<Movie[]>, an observable that emits an array of Movie values.

In your observer function, your are trying to assign the "movie" value, that is of Movie type, so they are incompatible.

To solve this issue, just declare the movie property ad use it in your observer, instead of movies$

public movie: Movie
[...]
this.movie = movie