2016-11-17 4 views
5

Ich habe eine Funktion innerhalb eines Angular2-Dienstes, die Mock-Daten über Promise.resolve zurückgibt, die, wenn sie mit .then ausgepackt wird, mir ein leeres Versprechen-Objekt gibt. Ich kann sehen, dass die anrufende Funktion in der __zone_symbole__value Eigenschaft, um die Versprechen mit der Nutzlast empfängt, bevor er in .then however inside of .then I seem to be left with just an empty promise.Typoskript-Versprechen Verlust von Werten nach .dann

getTemperatureData(): Promise<any> { 

    let data = this.convertJSONToGoogleChartTable(temperatureData_JSON); 
    let p = Promise.resolve(data); 
    return p; 
    } 

Mit Chrome ich übergeben wird, dass p oben wie

ZoneAwarePromise {__zone_symbol__state: true, __zone_symbol__value: "[["Date","Temperature","LowTemperature"],["05/11/2…",69.02,null],["06/11/2016 23:54:34",69.99,null]]"}

sieht

Der aufrufende Code, der in zwei Zeilen zum Debuggen unterteilt ist, ist unten.

getTemperatureData() { 
    var d = this.dataService.getTemperatureData(); 
    d.then(data => this.line_ChartData = data); 
} 

Wenn ich d aussehen sehe ich das gleiche wie p oben

ZoneAwarePromise {__zone_symbol__state: true, __zone_symbol__value: "[["Date","Temperature","LowTemperature"],["05/11/2…",69.02,null],["06/11/2016 23:54:34",69.99,null]]"}

Das Problem mit dem .then tritt auf, wenn der Wert von „d“ nur ein leeres Versprechen ist. Das Folgende wurde von der Chrome-Entwickler-Tools-Konsole übernommen, um zu zeigen, was ich sehe.

d.then(data => console.log(data)) 
ZoneAwarePromise {__zone_symbol__state: null, __zone_symbol__value: Array[0]} 

Egal, was ich tue und wie viele Kombinationen ich versucht habe ich nicht auf meine Daten innerhalb von d zu bekommen. (Beachten Sie, dass p und d sind nur vorübergehend den Code unten jetzt zu brechen.)

Mein package.json ist unten:

{ 
    "name": "angular2", 
    "version": "0.0.0", 
    "license": "MIT", 

    "angular-cli": {}, 
    "scripts": { 
    "start": "ng serve", 
    "lint": "tslint \"src/**/*.ts\"", 
    "test": "ng test", 
    "pree2e": "webdriver-manager update", 
    "e2e": "protractor" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "~2.1.0", 
    "@angular/compiler": "~2.1.0", 
    "@angular/core": "~2.1.0", 
    "@angular/forms": "~2.1.0", 
    "@angular/http": "~2.1.0", 
    "@angular/material": "^2.0.0-alpha.9-3", 
    "@angular/platform-browser": "~2.1.0", 
    "@angular/platform-browser-dynamic": "~2.1.0", 
    "@angular/router": "~3.1.0", 
    "core-js": "^2.4.1", 
    "ng2-bootstrap": "^1.1.16", 
    "node-mysql": "^0.4.2", 
    "rxjs": "5.0.0-beta.12", 
    "ts-helpers": "^1.1.1", 
    "zone.js": "^0.6.23" 
    }, 
    "devDependencies": { 
    "@types/jasmine": "^2.2.30", 
    "@types/node": "^6.0.42", 
    "angular-cli": "1.0.0-beta.19-3", 
    "codelyzer": "1.0.0-beta.1", 
    "jasmine-core": "2.4.1", 
    "jasmine-spec-reporter": "2.5.0", 
    "karma": "1.2.0", 
    "karma-chrome-launcher": "^2.0.0", 
    "karma-cli": "^1.0.1", 
    "karma-jasmine": "^1.0.2", 
    "karma-remap-istanbul": "^0.2.1", 
    "protractor": "4.0.9", 
    "ts-node": "1.2.1", 
    "tslint": "3.13.0", 
    "typescript": "~2.0.3", 
    "webdriver-manager": "10.2.5" 
    } 
} 
+1

'lassen p = Promise.resolve (Daten);' das ist seltsam. Ein Versprechen ist asynchron. Wenn Sie also das Ergebnis des Versprechens erwarten, funktioniert das nicht so. – Maxime

+0

Bitte zeigen Sie uns den ganzen Code. Was machst du mit this.line_ChartData? Leerst du es vielleicht irgendwo? Beachten Sie, dass es auf das gleiche Array verweist, das auch im Versprechen enthalten ist. Versuchen Sie 'this.line_ChartData = data.slice()' stattdessen – Bergi

Antwort

1

der Wert der Daten ist nur ein leeres Versprechen

Das sagt mir, dass convertJSONToGoogleChartTable ein Versprechen zurückgibt, und Sie verketten nicht Ihr Versprechen dazu.

Hinweis: Wenn Sie einen stärkeren Typ als any verwenden, würde der TypeScript-Compiler das wahrscheinlich für Sie erfasst haben.

Da Sie etwas zu tun, nicht nach, dass die Daten bekommen, können Sie dies nur tun:

getTemperatureData(): Promise<any> { 
    return this.convertJSONToGoogleChartTable(temperatureData_JSON); 
    } 

Aber wenn Sie etwas mit dieser Daten tun wollen, bevor es zurückkehrt, können Sie das in ein tun then , angekettet an das ursprüngliche Versprechen:

getTemperatureData(): Promise<any> { 
    return this.convertJSONToGoogleChartTable(temperatureData_JSON) 
     .then(data => { 
      console.log(data); 
      return data; 
     }); 
    } 
+0

Vielen Dank für Ihre Antwort. Die Funktion convertJSONToGoogleChartTable gibt nur eine Zeichenfolge zurück, bei der es sich um eine Konvertierung des rohen JSON handelt. Das ist alles innerhalb der Angular2-Dienstklasse, die ich zum Abrufen und Formatieren der Daten verwende. – JSeatter

+0

Vielen Dank für Ihre Antwort. Die Funktion convertJSONToGoogleChartTable gibt nur eine Zeichenfolge zurück, bei der es sich um eine Konvertierung des rohen JSON handelt. Das ist alles innerhalb der Angular2-Dienstklasse, die ich zum Abrufen und Formatieren der Daten verwende. Daten sehen wie "Daten " [["Datum", "Temperatur", "niedrige Temperatur"], ["05/11/2016 00:14:23", 72,44, null], ["05/11/2016 00:44:31 ", 71.46, null], [" 05.11.2016 01:14:39 ", 70.48, null], ....]]]" ' Das ist die Rückkehr zum Anrufer Ganz gut, in meinem Fall ist das "d" in der Angular2-Komponente. Wo es für mich schief geht ist das Extrahieren der obigen Zeichenfolge von d. – JSeatter

+0

@JSeater: Was passiert, wenn Sie Ihre Konsole betreten: 'Promise.resolve (2) .then (console.log)'? Was passiert, wenn Sie 'console.log (data)' nach dem Aufruf von 'convertJSONToGoogleChartTable' setzen? – StriplingWarrior

Verwandte Themen