Angular 5 Modelle Httpclient type casting

Question

Ich erkläre, ein Modell in ingredient.model.ts

export class Ingredient { 
constructor(private name: string, public amount: number) {} 

getName() { return this.name } 
} 

In ingredients.service.ts, wenn ich sie auf diese Weise erhalten:

httpClient.get<Ingredient>(url).subscribe(
(igredient) => { 
    console.log(igredient.getName()); 
}); 

gibt es Fehler in der Konsole, z. B. "keine Methode getName in property igridient".

Auch wenn ich versuche, eine Eigenschaft Typ Category [] zu deklarieren, schlägt es fehl, aber Array scheint gut zu funktionieren.

Bearbeiten: Ich möchte mehr Informationen zur Verfügung stellen.

{ 
name: "Apple", 
amount: "5", 
created_at: "date", 
} 

Der igredient Konstruktor nicht einmal aufgerufen wird, damit die GET-Nutzlast wird nicht analysiert werden:

das igredient Modell und die folgende JSON Struktur gegeben.

Answer 1

Sie müssen eine Eigenschaft verwenden, keine Methode. Das zurückgegebene Objekt ist wirklich ein JSON-Objekt, und es gibt keine "getName()" -Methode (trotz Ihrer Bemühungen, eine Typinformation hinzuzufügen). Versuchen Sie etwas wie folgt:

export interface Ingredient { 
    strin: string, 
    amount: number, 
    created_at: string 
} 


httpClient.get<Ingredient>(url).subscribe(
    (igredient) => { 
      console.log(igredient.amount); 
}); 

EDIT: Sie müssen eine Typinformation basierend auf dem erwarteten JSON-Objekt bereitstellen. Wenn das zurückgegebene JSON-Objekt die Attribute strin, amount und created_at hat, müssen Sie einen Typ definieren, der mit dem erwarteten JSON-Objekt kompatibel ist.