error TS2322: Type 'number' is not assignable to type 'string'

Tolis picture Tolis · Aug 30, 2018 · Viewed 10k times · Source

I am trying to build an app, where I want to get my posts, at first, by user and then when a post is clicked, I want to get this particular post by id.

And finally I get the following errors:

ERROR in src/app/cars/car-detail/car-detail.component.ts(25,11): error TS2322: Type 'Observable<{ _id: string; title: string; content: string; imagePath: string; creator: string; }>' is not assignable to type 'Car[]'.

Property 'includes' is missing in type 'Observable<{ _id: string; title: string; content: string; imagePath: string; creator: string; }>'.

src/app/cars/car-detail/car-detail.component.ts(26,11): error TS2322: Type 'number' is not assignable to type 'string'.

import { Input, Component, OnInit } from '@angular/core';
import { Car } from '../car.model';
import { CarsService } from '../cars.service';
import { ActivatedRoute, Params } from '@angular/router';


@Component({
  selector: 'app-post-detail',
  templateUrl: './post-detail.component.html',
  styleUrls: ['./post-detail.component.css']
})
export class PostDetailComponent implements OnInit {
  @Input() post: Post[] = [];
  @Input() id: string;
  constructor(
    private postsService: PostsService,
    private route: ActivatedRoute
  ) { }

  ngOnInit() {
    this.route.params
      .subscribe(
        (params: Params) => {
          this.post = this.postsService.getPost(this.id);
          this.id = +params['id'];
        }
      );
  }

}

What should I do?

Answer

Suren Srapyan picture Suren Srapyan · Aug 30, 2018

1)

@Input() id: string is of type string, but when you do this.id = +params['id']; - + operator tries to parse params['id'] to number, so why you get error.

Set type of the @Input() id: string to number.

2)

this.post = this.postsService.getPost(this.id);

As I consider getPost returns an observable. You need to subscribe to it and then assign the result returned from the call to the post property.

this.postsService.getPost(this.id).subscribe(res => this.post = res);