Question

我正在从AngularJS迁移到Angular 6，在JS中，我使用了$resource，当我获得数据时，看起来像这样...

{
  "SomeList": [{
      "SomeID": "123456",
      "SomeName": "Joe Shmoe",
      "SomeCode": "987654",
      "Address1": null,
      "Address2": null,
      "City": null,
      "State": null,
      "Zip": null,
      "Phone1": null,
      "Phone2": null,
      "Email": null

    },
    {
      "SomeID": "234567",
      "SomeName": "Joe Bagodonuts",
      "SomeCode": "456123",
      "Address1": null,
      "Address2": null,
      "City": null,
      "State": null,
      "Zip": null,
      "Phone1": null,
      "Phone2": null,
      "Email": null
    },
    etc...
  ]
}

它很好地流入了一个变量，我可以使用数据了。

在打字稿中，我已经设置好...

模型

export class SomeList {
  SomeID: string;
  SomeName: string;
  SomeCode: string;
  Address1: string;
  Address2: string;
  City: string;
  State: string;
  Zip: string;
  Phone1: string;
  Phone2: string;
  Email: string;
}

export class SimpleResponse < T > {
  Data: T;
}

export class SimpleResponseLower < T > {
  data: T;
}

设置为单例模型的变量

public static somies: SomeList[];

数据服务

getSomeList<SomeList>(year: number): Observable<SomeList[]>{
  const url = `${Urls.Somies()}?cropYear=` + year;
  var host = window.location;
  var combineurl = host.href + 'api/RequestHandler?uri=' + url;
  return this.http.get<SimpleResponse<SomeList[]>>(combineurl).pipe(map(r => 
r.Data));

 ***The call below is what returned the sample data above
 //return this.http.get(combineurl).pipe(map(value =>{return value}));

  }
}

以及对数据服务的调用，填充了该类

this.dataService.getSomeList < SomeList > (2018)
  .subscribe((data) => {
      this._formValues.somies = data;
    },
    () => {
      // put some code here and remove console.log
    }); // end of error block);
}

我已经尝试了几乎所有我能想到的配置，并且数据返回“未定义”，没有错误，并且填充了浏览器的“网络”选项卡中列出的链接。

任何帮助或想法都将不胜感激！！

Answer 1

您的JSON应该直接映射到您的模型。

您的数据应该是：

'{
   "Data": [
      {
        "SomeID": "123456",
        "SomeName": "Joe Shmoe",
        "SomeCode": "987654",
        "Address1": null,
        "Address2": null,
        "City": null,
        "State": null,
        "Zip": null,
        "Phone1": null,
        "Phone2": null,
        "Email": null
      }, etc...
   ]
}

或者您的简单答复应该包含SomeList：

export class SimpleResponse<T> {
   SomeList: T;
}

并且您应该映射到响应的SomeList属性，而不是Data。

return this.http.get<SimpleResponse<SomeList[]>>(combineurl).pipe(map(r 
 => r.SomeList));

Answer 2

好的，我能够弄清楚这一点。我要做的是...

更改从api返回的类型

string jsonString = client.DownloadString(fullUri);                                
JObject infoObj = JsonConvert.DeserializeObject<dynamic>(jsonString);
string data = infoObj.ToString();                                   
return data;

收件人

string jsonString = client.DownloadString(fullUri);                                
JObject infoObj = JsonConvert.DeserializeObject<dynamic>(jsonString);
SimpleResponse<JObject> data = new 
SimpleResponse<JObject>();
data.Data = infoObj;                                
return data;

在typeScript方面，我不得不将模型更改为

export class SimpleResponse<data> {
data: data;
}
export class SomeResponse{
SomeList: SomeList[];
Message: string;
}

在我的数据服务中，而不是返回...

<SimpleResponse<SomeList[]>>

我回来

<SimpleResponse<SomeResponse>>

我不确定这是否是“ TypeScript”方法，或者是否有更好的通用方法，因此我不必为每次对API的调用添加ResposeClass ...但是它正在工作！

使用JObject填充Typescript类

2 个答案: