Angular HttpClient 方法不转换响应类型

Question

刚开始使用新的 HttpClient，但每当我进行调用时，响应都不会使用提供的类型进行转换。我尝试了接口(interface)和类。现在我假设您只能使用接口(interface)来转换为响应，因为这是我们在文档中看到的唯一示例。

我宁愿使用类在模型中包含一些辅助函数。有没有办法以这种方式实现这一目标？

组件

export class InvoicesComponent implements OnInit{    
invoices;

constructor(private invoiceService: InvoiceService){}

ngOnInit() {
   this.invoiceService.index()
   .subscribe(
       (invoices) => {
           console.log(this.invoices);
       }
    );
}

服务等级

export class InvoiceService {
constructor(private api :HttpClient) {}   

  index() {
    return this.api.get<Array<Invoice>>('/invoices');
  }
}

界面

import { Customer } from "./Customer";
import { Payment } from "./Payment";

export interface IInvoice{
id: number;
user_id: number;
number: string;
cost: number;
status: number;
customer: Array<Customer>;
payments: Array<Payment>;
created_at: Date;

updated_at: Date;
deleted_at: Date;
}

Answer 1

Is there a way to achieve this that way?

HttpClient 不知道如何为返回的数据实例化一个类。你需要自己做:

const invoices$ = this.http.get('/invoices')
  .map(data => data.map(invoice => new Invoice(invoice)));

这假设您的 Invoice 类有一个构造函数，它使用 API 端点返回的数据来创建一个实例。

这里没有实际的 »casting« 进行。它在 Typescript 中被称为类型断言，因为它只影响类型信息。这可以通过这个简单的例子看出:

const value1: any = 42;
const value2: string = value1 as string;
console.log(typeof value2); // 'number'

value2 将被(错误地)输入为字符串，但它仍然是一个数字，对其调用字符串方法将使 Typescript 编译器满意，但会在运行时导致错误。