类型 'Promise<string[]>' 不可分配给类型 'string[]'

Question

收到以下错误：类型"Promise<string[]>"不能分配给类型"string[]"。 类型"承诺<字符串[]>"中缺少属性"include"。

当我将 Promise<string[]> 转换为键入"string[]"时 我在下面的代码，

组件：app.dashboard.ts

import {Component} from '@angular/core';
import { MemberService } from "./app.service";
@Component({
selector:'app-root',
templateUrl:'./app.dashboard.html',
providers:[MemberService]
})
export class AppDashboard{
title='Dashboard'
constructor(private memberService: MemberService) { }
public doughnutChartLabels:string[] = 
this.memberService.getmemberheader();//error occurred here
}
}

服务：app.service.ts

import { Injectable } from '@angular/core';
import { Member } from './Member';
import { Http, Response, Headers, RequestOptions, URLSearchParams } from'@angular/http';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/toPromise';
@Injectable()
export class MemberService
{
constructor(private http: Http) {
}

private getHeaders(){
// I included these headers because otherwise FireFox
// will request text/html instead of application/json
let headers = new Headers();
headers.append('Accept', 'application/json');
return headers;
}

getmemberheader(): Promise<string[]> {
return this.http
.get(`/ReportService/MemberDatabaseCountryname`, {headers: this.getHeaders()})
.toPromise()
.then(this.extractData)
.catch(this.handleError);
}  
private extractData(res: Response) {
let body = res.json();

return body || {};
}
private handleError(error: any): Promise<any> {
console.error('An error occurred', error);
return Promise.reject(error.message || error);
}
}

Answer 1

假设你从http.get的响应是一个数组，这里你从函数memberService.getmemberheader返回Promise，你应该在它的then回调中检索promise的结果(而不是将promise本身分配给数组doughnutChartLabels(。

public doughnutChartLabels: string[];
this.memberService.getmemberheader().then(res => {
this.doughnutChartLabels = res;
})

Answer 2

@levolutionniste

函数 getmemberheader(( 返回一个 promise。

承诺的主要动机是将同步样式错误处理引入异步/回调样式代码。 ES6 在其 Promise 实现中采用了此规范。承诺具有一种特殊的语法，允许承诺以菊花链方式连接在一起，从而允许一个承诺的结果馈送下一个承诺。

所以：

getmemberheader()
.then((returnsAStringArrayObjectHere_YouCanCallItAnythingYouLike) => {
// Do something with this array here
})
.catch((error) => {
console.log("Oops something went wrong: ", error);
});

以下是一些关于承诺的文章：

• https://basarat.gitbooks.io/typescript/docs/promise.html - 我的最爱。
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

所以getmemberheader将返回一个字符串[]类型的承诺。

this.memberService.getmemberheader().then(res => {
this.doughnutChartLabels = res;
})

这就是为什么在中间行变量res包含来自 getmemberhead promise 的字符串 []。然后在代码块 {} 中，用户将字段 doughnutChartLabels 设置为此变量 res。

承诺非常好用，尤其是在使用经常返回承诺的ORM时，可以轻松地将它们菊花链连接在一起 - 这确保了代码在整个承诺链中从左到右同步运行。