类型“对象”上不存在属性“过滤器”。 尝试过滤响应时

Question

Im trying to get data from a json file that equal the name of the player in the url. For example: localhost:4200/players/Febiven should only return the information about Febiven. Im using Angular 6

So far I have this code:

player.service.ts

  get(ingameName){
    return <Observable<Player>> this.http.get(endpoint).map(response =>{
        let data = response.filter(item=>{
          if (item.ingameName == ingameName) {
            return item
          }
        });
        if (data.length == 1){
          return data[0]
        }
        return {}
      })
      .catch(this.handleError)
  }

  private handleError(error:any, caught:any): any{
    console.log(error, caught)
  }

player-info.component.ts

 export interface Player {
  ingameName: string;
  name: string;
  intro: string;
  image: string;
  info: string;
  team: string;
  dob: string;
  earnings: string;
  role: string;
  game: string;
  favourite: string;
  IDs: string;

}

export class PlayerInfoComponent implements OnInit {
  players: Player[] = null;
  private routeSub:any;
  private req:any;
  ingameName:string;
  player : player;


  constructor(private route: ActivatedRoute, private plService : PlayerService) { }

  ngOnInit() {
    this.routeSub = this.route.params.subscribe(params => {
      this.ingameName = params['ingameName'];
      this.req = this.plService.get(this.ingameName).subscribe(data=>{
        this.player = data as player
      })
    });

Im getting the error 'Property 'filter' does not exist on type 'Object'. And I don't really have an idea how to fix this, I looked at multiple answers, but none seemed to work for me. If someone could help me with fixing this error thatd be great

Thanks

Answer 1

filter only exists on arrays. Your response is an object. You can do this instead:

get(ingameName){
    return <Observable<Player>> this.http.get(endpoint).map(response =>{
        let data = response.json();
        if (data.ingameName == ingameName){
           return data;
        }
        return {};
    })
    .catch(this.handleError)
}

Answer 2

Try this it will work: define a parameter inside your class & use it in ngOnInit() function like this:

 export class VideoDetailComponent implements OnInit, OnDestroy { data_new:any; ngOnInit() { this.http.get("assets/json/videos.json").subscribe(data =>{ this.data_new = data; this.data_new.filter(item=>{ console.log(item) // do your work here }) }) } }