javascript - 在获得 Angular 5 的结果后，如何确保 typescript 接口(interface)属性为大写？

Question

我有一个返回以下结果的 web api

{
  "customerContactID": 1,
  "customerID": 1,
  "firstName": "james",
  "lastName": "smithman",
  "primaryEmail": "james@gmail.comm",
  "primaryPhone": "8788494677",
  "isPrimaryContact": true
}

我有一个 Angular 5 应用程序，它定义了一个接口(interface)

    interface CustomerContact {
      CustomerContactID: number;
      CustomerID: number;
      FirstName: string;
      LastName: string;
      PrimaryEmail: string;
      PrimaryPhone: string;
      IsPrimaryContact: boolean;
  }

并使用

返回结果

            this.http.get<CustomerContact>(url).subscribe(result => {
            console.log("CustomerContact obtained");
            console.log(result); // prints lowercase properties
            this.customerContact = result;
        }, error => console.error(error));

不幸的是，当我记录结果时，我可以看到属性都被小写了，所以我不能做类似的事情

this.currentCustomer = result.CustomerID;

因为它导致未定义。但是，我需要能够将变量值设置为从 api 结果获得的值，特别是 result.CustomerID。 typescript 不允许我这样做

this.currentCustomer = result.customerID;

因为它导致

TS2551: Property 'customerID' does not exist on type 'CustomerContact'. Did you mean 'CustomerID'?

如何在编译器 [at-loader] 错误的情况下将变量的值设置为 result.customerID 的值？

我根本无法更改 API 协定，而且，我的 typescript 接口(interface)必须使用大写字母作为属性名称。

更新 1正如下面提到的@pArth savadiya，看起来我可以做到

虽然，我不确定是否会产生影响，如果有的话

我不认为这是重复的 Convert returned JSON Object Properties to (lower first) camelCase因为那个问题有一个具有大写属性的结果模型，这不是我在这里所拥有的。

更新 2经过仔细观察，我意识到这里的大问题是 api 响应属性大小写与 Angular/ typescript 大小写不匹配之间的 MISTMATCH。如果它们不相同，则会导致问题并强制采用奇怪的解决方法。解决方案只是将接口(interface)外壳与针对此特定请求的响应外壳相匹配。就这么简单。谢谢大家。

Answer 1

在您的代码中，您将 HTTP 响应结果与您的 typescript 接口(interface)(CustomerContact)紧密耦合，而不是使用它。

this.http.get <any> (url).subscribe(result => {
  console.log("CustomerContact obtained");
  console.log(result); // prints lowercase properties
  this.customerContact = result;
}, error => console.error(error));

然后你就可以写了this.currentCustomerID = result.customerID;

或者您可以这样尝试:this.currentCustomer = result["customerID"];