web-dev-qa-db-fra.com

type observable <{}> n'est assignable à aucun type: la longueur de la propriété est manquante dans le type {} dans le texte

J'essaie de conserver les données JSON dans le système local en utilisant Angular2 http.

import { Injectable }     from '@angular/core';
import { Http, Response } from '@angular/http';
import { General }        from './general';
import { Observable }     from 'rxjs/Observable';

@Injectable()
export class GeneralService {
    // #docregion endpoint
    private statusUrl = './jsondata';  // URL to web API
    // #enddocregion endpoint

    // #docregion ctor
    constructor (private http: Http) {}
    // #enddocregion ctor

    // #docregion methods, error-handling, http-get
    getStatus (): Observable<General[]> {
        return this.http.get(this.statusUrl)
            .map(this.extractData)
            .catch(this.handleError);
    }
 private extractData(res: Response) {
        let body = res.json();
        return body.data || { };
    }


    private handleError (error: Response | any) {
        // In a real world app, we might use a remote logging infrastructure
        let errMsg: string;
        if (error instanceof Response) {
            const body = error.json() || '';
            const err = body.error || JSON.stringify(body);
            errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
        } else {
            errMsg = error.message ? error.message : error.toString();
        }
        console.error(errMsg);
        return Observable.throw(errMsg);
    }

}

Je reçois une erreur- Le type observable <{}> n'est pas assignable au type 'Observable'. Le type '{}' n'est pas assignable au type 'Général []'. La longueur de la propriété est manquante dans le type '{}'

Ici, général est un nom de classe. J'utilise rxjs-5.0. Je suis Angular.io Tour of Heroes et je crée mon propre projet. Toute aide sur ceci?

angulartypescriptrxjs
9
Protagonist

J'ai changé mes importations de
import {Observable} de 'rxjs/Observable';
à
import {Observable} de 'rxjs';
Et tout a fonctionné

5
Norman Pilusa

Le problème est que vous dites à observable d'obtenir une liste de Genral pendant que vous obtenez un objet.

getStatus (): Observable<General[]>

Si vous n'acceptez pas de tableau, faites comme ceci

getStatus (): Observable<General>
2
Jorawar Singh

Je voudrais ajuster la extractData comme ceci: 

private extractData(res: Response): General[] {
    let body = res.json();
    return (body.data || []) as General[];
}

Maintenant, il dit qu'il va renvoyer General[] et il affirme également que body.data est de ce type. En cas de résultat nul, un tableau vide est renvoyé

1
Radim Köhler

Le compilateur dit que vous essayez d'affecter un objet à un tableau (de généraux).

Je suppose que votre problème est dans return body.data || {} dans extractData. Essayez return body.data || [] à la place.

0
Alex

Mettez à jour votre code comme ci-dessous:

getStatus(): Observable<Genral[]> {
  return this.http.get(this.statusUrl)
    .map((res) => this.extractData(res))
    .catch((err) => this.handleError(err));
}
0
Swanand

L'affectation incorrecte ne provient pas de l'appel extractData() mais de celui catch().

Essaye ça:

getStatus(): Observable<General[]> {
    return this.http.get(this.statusUrl)
        .map(this.extractData)
        .catch<General[]>(this.handleError);
}
0
jls2933