0
// interface    
export interface IMovie {
    id: number;
    name: string;
    releaseDate: string;
    genre: string;
}

//component:

movie: IMovie = null;
  ngOnInit() {
    this.route.paramMap.subscribe((params: ParamMap) => {
      const movie_id = parseInt(params.get('movie_id'), 10);
      this.movieService.getMovieById(movie_id)
        .subscribe((movie) => this.movie = movie);
    });
  }

//service
getMovieById(movie_id: number): Observable<IMovie> {
    return this.http.get<IMovie>(url);
}

When I am trying to print in the component code I am able to see the Object (console.log(movie)), I don't understand why the mapping i.e Object -> IMovie is not happening.

I tried in different ways nothing worked for me.

jonrsharpe
  • 115,751
  • 26
  • 228
  • 437
dr3662
  • 41
  • 5
  • 1
    Type hints **do not cause any casting or conversion**. Given that all of the value types in `IMovie` are primitive, what would you even want to be converted? Interfaces don't even *exist* at runtime, you're always just going to see a plain object. – jonrsharpe Jul 18 '18 at 21:20
  • Possible duplicate of [No methods in http response object](https://stackoverflow.com/questions/48102824/no-methods-in-http-response-object) – jonrsharpe Jul 18 '18 at 21:23
  • I want to use the "movie" object in the template, but the response movie object is not assigned to this.movie object. I tried to print this.movie which is showing null. – dr3662 Jul 18 '18 at 21:33
  • What jonrsharpe is trying to tell you is that `` has no effect on the code at runtime, it's just here to help you code and debug when you are using your IDE. – Ploppy Jul 18 '18 at 21:35
  • *Where* did you try to `console.log(this.movie)`. Until the callback to the inner subscription gets invoked that will still be the original value, which *you set to `null`*. You have to wait for the `params` subscription to provide the parameter value, *then* for the HTTP request to complete, before you'll have a non-`null` value. And none of that is anything to do with whether or not the response is being mapped to an interface. – jonrsharpe Jul 18 '18 at 21:35
  • ` ngOnInit() { this.route.paramMap.subscribe((params: ParamMap) => { const movie_id = parseInt(params.get('movie_id'), 10); this.movieService.getMovieById(movie_id) .subscribe((movie) => this.movie = movie); }); console.log(this.movie); } ` – dr3662 Jul 18 '18 at 21:41
  • Thats wrong. log in inside subscribe – Antoniossss Jul 18 '18 at 21:42
  • 1
    1. [Edit] the question, code is unreadable in comments. 2. It's guaranteed to still be `null` there, the whole point of using observables and callbacks is that you have two *asynchronous* operations happening before that value gets set. I'd strongly encourage reading up on these topics, they're crucial to using Angular. – jonrsharpe Jul 18 '18 at 21:43
  • 1
    Analogy: you're trying to eat a toast immediately after you put it inside the toaster. The tost is not ready at that time. It's only ready when the toaster notifies you that the toast is grilled, i.e. when the callback passed to subscribe() is called. That's what asynchronism is. – JB Nizet Jul 18 '18 at 21:44
  • @JBNizet nice. The analogy could use a toasting fork instead of a toaster, but that would be anachronistic asynchrony. – jonrsharpe Jul 18 '18 at 21:45

0 Answers0