时间戳

首页 > 解决方案 > 如何将此 API get() 结果转换为 JSON 对象？

json - 如何将此 API get() 结果转换为 JSON 对象？

问题描述

API 端点返回一个 observable。当我试图检索返回对象的任何属性时，它显示该属性在类型 {} 上不存在

这是端点结果

{
  "base": "EUR",
  "date": "2018-04-08",
  "rates": {
    "CAD": 1.565,
    "CHF": 1.1798,
    "GBP": 0.87295,
    "SEK": 10.2983,
    "EUR": 1.092,
    "USD": 1.2234,
  }
}



服务.ts

import { Injectable } from '@angular/core';
import { HttpClient, HttpResponse } from '@angular/common/http';
import { Observable } from 'rxjs';
import { ConvertResultModel } from './converter/convert-result-model';

@Injectable({
  providedIn: 'root'
})
export class ServiceProviderService {
  private baseUrl = 'https://api.exchangeratesapi.io/latest';
  constructor(private http: HttpClient) { }
  getLatest():Observable<ConvertResultModel>{
    return this.http.get<ConvertResultModel>(this.baseUrl);
  }
}



转换器.component.ts

import { ServiceProviderService } from './../service-provider.service';
import { Component, OnInit } from '@angular/core';


@Component({
  selector: 'app-converter',
  templateUrl: './converter.component.html',
  styleUrls: ['./converter.component.css']
})
export class ConverterComponent implements OnInit {

  constructor(private serviceProvider: ServiceProviderService) { }
  private resultSet = {};
  ngOnInit()
  {
    this.serviceProvider.getLatest().subscribe(data => this.resultSet = data);
    console.log(this.resultSet.base);
  }
}



转换结果-model.ts

export interface ConvertResultModel {
  base: number;
  date: string;
  rates: any[];
}



src/app/converter/converter.component.ts(17,32) 中的错误：错误 TS2339：“{}”类型上不存在属性“base”。

标签： jsonangularobservable

解决方案

这都是关于打字稿中的类型检查。这是一件好事，但有时您不想定义所有内容的类型。

所以你可能想更换

private resultSet = {};

有类似的东西

private resultSet:any = {};
// or 
//private resultSet:any = null;

或者定义一个类或接口并将类型设置resultSet为该类或接口。就像是：

public interface ResultSet{
  base: String;
  // etc
}

接着

private resultSet:ResultSet= {} as ResultSet;
// or 
//private resultSet:ResultSet= null;

但我的建议是尝试使用 typescript 的力量来练习，它可以帮助你在编译时而不是运行时捕获一些错误

推荐阅读