Angular Promise <void> 'ist nicht zuweisbar Typ

Question

Ich baue Angular4 Website mit Contentful CMS API, um Daten abzurufen. Das Problem ist, dass ich die richtigen Typen für die zurückgegebenen Daten nicht zuweisen kann, auch wenn die Konsole diese Typen anzeigt.

die Scheindaten:

export const NAMES: Page[] = content.getEntries({ 
    content_type: 'mainMenu' 
}).then(function(response){ 
response.items.forEach(element => { 
    return element.fields; 
}) 
}); 

Welche Rückkehr über die Konsole ist (wenn verwendet console.log):

Object { title: "About Aliens" } 
Object { title: "Portfolio" } 
Object { title: "Meet the team" } 
Object { title: "Contact us" } 

und die Klasse I, diese Datentypen zuweisen verwenden:

Ich bin neu in Typescript und ich möchte wissen, wo ich falsch lag, und ich würde es schätzen, wenn jemand mich leitete e Ich kann die Daten aus einer beliebigen API zurückgeben.

Vielen Dank.

Answer 1

Ihrer Seite Klasse eine Schnittstelle für Typ Behauptung für Instanziierung ohne die Notwendigkeit zu Stellen, wie so

export interface Page { title : string } 

Answer 2

1. Sie versuchen, ein Versprechen auf ein Array zuweisen, haben Sie die Zuordnung in der Rückruf zu tun von der Verheißung.
2. Ihre then Aufruf auf das Versprechen gibt nichts zurück, ein Anruf an forEach iteriert über eine Sammlung, aber gibt nichts zurück. Wenn Sie etwas erstellen/zurückgeben möchten, können Sie map verwenden, das basierend auf dem übergebenen Prädikat eine neue Sammlung erstellt.
3. Verwenden Sie eine Pfeil-Funktion für den Versprechen Rückruf, so dass Sie einen Verweis auf this haben, sollten Sie es brauchen.
4. Es besteht keine Notwendigkeit, Seite einen konkreten Typ zu machen, verwenden Sie stattdessen eine Schnittstelle, so dass Sie Casting verwenden können. Sie benötigen nur einen konkreten Typ, wenn Sie Verhalten hinzufügen, aber wenn es nur ein einfaches altes Objekt ist, das von json deserialisiert wird, verwenden Sie eine Schnittstelle.

Das Update:

export NAMES: IPage[]; // no assignment at this point 

Execute getEntries aus irgendeiner Methode.

content.getEntries({ 
    content_type: 'mainMenu' 
}).then((response) => { 
    NAMES = response.items.map(element => element as IPage); 
}); 

IPage

export interface IPage { 
    title: string; 
}