解析rxjs中的JSON ajax回调无法正常工作

时间:2017-10-07 14:04:49

标签: json angular parsing typescript rxjs

我试图在Angular2中的ajax回调中解析JSON字符串 在我致电console.log()并执行{ "success": true, "data": { "id": "14cf4717-f5b6-4002-96b2-321324fc4077", "number": "1234", "sections": [ { "id": "53f43dd7-4c93-4925-a51d-c6f81f314275", "description": "Test", "created_at": "2017-10-07 15:08:01", "updated_at": "2017-10-07 15:08:01", "lines": [ { "id": "73fab07f-4401-43a4-99a4-13c891907ea7", "product_id": "62aa5388-712d-4ab1-9e64-6849889194d1", "product_name": "Product", "product_description": "test", "product_type": "product", "quantity": "1.00", "product": { "id": "62aa5388-712d-4ab1-9e64-6849889194d1", "name": "Product", "description": "test" } } ] } ], "notes": [] } } 后,工作正常。

这是我试图解析的JSON:

 public getQuotation(quotationId: string, callback: Function) {
    this.http.get('/quotation/' + quotationId).subscribe((response) => {

      const responseJson = response.json();
      console.log(responseJson);

      callback(null);
    }, () => {
      callback(null);
    });
  }

在此功能中:

console.log()

结果如预期: parsed json

但是当我在const quotation = <FinBaseModel>(responseJson.data);下面添加 这一行时: public getQuotation(quotationId: string, callback: Function) { this.http.get('/quotation/' + quotationId).subscribe((response) => { const responseJson = response.json(); console.log(responseJson); const quotation = <FinBaseModel>(responseJson.data); callback(quotation); }, () => { callback(null); }); }

lines

然后console.log()数组为空......

Missing lines array

我不明白这是怎么可能的,因为我在尝试将其投放到FinBaseModel之前执行AC_INIT([myprog], [0.1], [dev@corp.com]) AM_INIT_AUTOMAKE([foreign -Wall -Werror]) AM_EXTRA_RECURSIVE_TARGETS([quality]) AC_PROG_CC AC_SUBST([AM_CFLAGS]) AC_CONFIG_HEADERS([config.h]) AC_CONFIG_FILES([Makefile src/Makefile]) AC_OUTPUT

有谁知道这是怎么可能的以及如何解决它?

4 个答案:

答案 0 :(得分:3)

您可以这样做,而不是使用JSON.parse:

this.http.get('/quotation/' + quotationId)
    .map(response=> response.json())
    .subscribe((responseData) => {
         console.log(responseData);
    });

答案 1 :(得分:3)

console.log通过引用打印对象。它在打印发生的时候发生了变异,可能是回调。

console.log(responseJson.data) 
const quotation = <FinBaseModel>(responseJson.data);
callback(quotation);

答案 2 :(得分:0)

宽度您现在提供的信息我无法帮助您解决问题。但我可以帮助您正确调试代码: 要查看实际值,如果在记录时更改了值,则必须记录其克隆以确保回调不会更改它。因此,使用console.log(response.data)更改console.log(JSON.parse(JSON.stringify(response.data)))。更改两个日志并比较结果。我想这会帮助你理解它并没有改变,但你的任何回调都在改变它。因为TypeScript类型实际上没有做任何事情,只是为您提供类型保险和准确性。

答案 3 :(得分:0)

使用HttpClient。 Documentation
这应该做:

http.get<ItemsResponse>('/api/items').subscribe(data => {
// data is now an instance of type ItemsResponse, so you can do this:
   this.results = data.results;
});


 getQuotation(quotationId: string, callback: Function) {
    this.http.get<FinBaseModel>('/quotation/' + quotationId).subscribe((data) => {

 // call your callback here and pass 'data'
 // callback(data)
 // or return the value and consume it no need to json to
    return data
}