Issue
I try to get the json-data from a api-server. I can't add this to the variable. I got the error
Type is missing the following properties from Type "Observable" missing the properties from type "GAMELIST[]": "length, pop, push, concat" und 27 weitere.ts(2740)
Where I is my mistake?
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { HttpClient } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { catchError, retry } from 'rxjs/operators';
import gamelistjson from '../../assets/data/gamelist.json';
interface GAMELIST {
id: number,
title: string,
releasedate: number,
shortdescription: string,
adddate: string,
changedate: string,
tags: any
}
@Component({
selector: 'app-gamelist',
templateUrl: './gamelist.component.html',
styleUrls: ['./gamelist.component.css']
})
export class GamelistComponent implements OnInit {
private data:any = [];
games: GAMELIST[] = this.getJSON();
idspiel: number = 0;
constructor(private router: Router, private http: HttpClient) {
this.getJSON().subscribe(data => {
console.log(data);
});
}
ngOnInit(): void {
}
public getJSON(): Observable<any> {
return this.http.get("https://example.org/api/gamelist");
}
onSelect(game: any){
this.router.navigate(['/spiel', game.id, game.title]);
}
}
Solution
I think this is the problematic line.
games: GAMELIST[] = this.getJSON();
this.getJson() returns an observable and you're trying to assign observable to GAMELIST[] type. You should assign it inside the subscription
Here is the changed code;
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { HttpClient } from '@angular/common/http';
import { Observable, throwError } from 'rxjs';
import { catchError, retry } from 'rxjs/operators';
import gamelistjson from '../../assets/data/gamelist.json';
interface GAMELIST {
id: number,
title: string,
releasedate: number,
shortdescription: string,
adddate: string,
changedate: string,
tags: any
}
@Component({
selector: 'app-gamelist',
templateUrl: './gamelist.component.html',
styleUrls: ['./gamelist.component.css']
})
export class GamelistComponent implements OnInit {
private data:any = [];
games: GAMELIST[];
idspiel: number = 0;
constructor(private router: Router, private http: HttpClient) {
}
ngOnInit(): void {
this.getJSON().subscribe(data => {
this.games = data;
});
}
getJSON(): Observable<GAMELIST[]> {
return this.http.get("https://example.org/api/gamelist");
}
onSelect(game: any){
this.router.navigate(['/spiel', game.id, game.title]);
}
}
Answered By - Talha Akca
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.