Как преобразовать результат API get () в объект JSON?

Question

Конечная точка API, возвращающая наблюдаемое. Когда я пытаюсь получить какое-либо свойство возвращаемого объекта, оно показывает, что свойство не существует для типа {}

Это результат конечной точки

{
  "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,
  }
}

service.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);
  }
}

converter.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' не существует для типа '{}'.

Answer 1

Все о проверке типов в машинописи.Что-то хорошее, но иногда вы не хотите определять тип всего.

Поэтому вы можете заменить

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;

Но я советую попрактиковаться в использовании мощности машинописи, которая поможет вам отлавливать некоторые ошибки во время компиляции вместо времени выполнения