Angular2将json结果强制转换到接口

使用Angular2和typescript，我从webApi返回了JSON，我需要将其放入特定类型的数组中。我不知道如何将json转换为我需要的接口

我的类型是此接口：

export interface Country {
    Id: number;
    Name: string;
}

My mock返回此数组：

export var COUNTRIES: Country[] = [
    { "Id": 11, "Name": "US" },
    { "Id": 12, "Name": "England" },
    { "Id": 13, "Name": "Japan" }
];

这是我的密码： 国家服务

@Injectable()
export class CountryService {
    private _http = null;

    constructor(http: Http) {
        this._http = http;
    }

    getCountries() {
        return Promise.resolve(COUNTRIES);
    }
}

然后我用这个称呼它：

export class CountryPickerComponent {
    public countries: Country[];

    constructor(private _countryService: CountryService) { }


    getCountries() {
        this._countryService.getCountries().then(data => this.setData(data));
    }

    setData(data) {
        //this.countries = data;
        this.countries = JSON.parse(data);
        var q = 1;
    }

    ngOnInit() {
        this.getCountries();
    }
}  

如您所见，我有一个名为countries的类变量，它是Country接口的数组。这正如预期的那样有效。（我知道我不需要setData方法-它是用于调试的）

接下来，我将服务更改为返回此json的wepApi调用

"[{"name":"England","id":1},{"name":"France","id":2}]"

我将服务中的getCountries方法更改为：

getCountries() {
    return new Promise(resolve=>
        this._http.get('http://localhost:63651/Api/membercountry')
            .subscribe(data => resolve(data.json()))
    );
}

使用JSON.parse，我将其转换为一个数组，然后在angular2中使用。它起作用了。它使用数据创建数组。但它不是一个实现国家界面的数组

请注意，JSON中的字段名都是小写的，但接口属性以大写开头，我对接口进行了编码。因此，当我得到真正的json时，它就不起作用了。有没有一种方法可以将其“转换”到接口，该接口会抛出一个错误并让我知道出了什么问题

许多示例在get中使用map，如下所示：

  getCountries() {
        var retVal;

        return new Promise(resolve=>
            this._http.get('http://localhost:63651/Api/membercountry')
                .map(ref => ref.json())
                .subscribe(data => resolve(data.json()))
        );
    }

---

我找不到这方面的文档。当我尝试它时，我从未得到数据，但没有错误。没有编译错误和运行时错误。

您可以对JSON.parse创建的对象所需的接口执行类型断言

 this.http.get('http://localhost:4200/').subscribe((value: Response) => {
    let hero = <ServerInfo>value.json();
  });

this.http.get（'http://localhost:4200/“）。订阅（（值：响应）=>{
让hero=value.json（）；
});

但是，如果服务器出于两个原因向您发送错误对象，这不会导致任何错误

在编译时，transpiler不知道服务器将发送什么

在运行时，所有类型信息都被删除，因为所有内容都被编译为 javascript。

Viktor Savkin对这种情况有一个解决方案，但它不适用于接口，因为Typescript不导出接口上的运行时信息。对此有一个讨论

有两种可能的解决方案：

• 如果您知道来自api的数据是正确的形状，并且您只是想向IDE/编译器提供有关此形状的信息，那么您可以按照toskv的答案进行转换
• 如果您不确定api，并且希望您的应用程序在数据形状错误时抛出，那么您必须实现自己的检查。这是一点开销，但对于更大的应用程序来说是值得的

---

一般来说，我把Typescript的类型看作编译器提示，而不是严格的类型系统——毕竟它必须编译成非类型语言

如果您使用的是

angular2beta

，

map

在从

http.get（）

返回的

Observable

中不可用，而

subscribe

直接用于

Observable

。在运行时它是非类型化的，在编译时我们不知道api将返回什么。这是有道理的，但实际上没有帮助。我想我们需要先了解json，然后相应地构建我们的对象。@user1617407。您不能强制转换到未知接口。。好吧，你可以投任何一个，但这也没有真正的帮助。