仅从 Angular 的 JSON 对象数组中获取部分值

Question

从 Web 服务返回的 Json 是

[
    [
        {
            "strOrderType": "New",
            "strOrderCode": "order006.1",
            "strDescription": "Automation Testing",
            "strStarts": "02 Jun 2020",
            "strEnds": null,
            "strOrderBy": "mnoo1",
            "strContractType": "Time",
            "intDocument": -1
        },
        {
            "strOrderType": "New",
            "strOrderCode": "order987.1",
            "strDescription": "Automation Testing",
            "strStarts": "02 Jun 2020",
            "strEnds": null,
            "strOrderBy": "mnoo1",
            "strContractType": "Time",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br /> -> Create project",
            "intDocument": -1
        },
        {
            "strOrderType": "New",
            "strOrderCode": "order974.1",
            "strDescription": "Automation Testing",
            "strStarts": "02 Jun 2020",
            "strEnds": null,
            "strOrderBy": "mnoo1",
            "strContractType": "Time",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br /> -> Create project",
            "intDocument": -1,

        },
        {
            "strOrderType": "CR",
            "strOrderCode": "order892.10",
            "strDescription": "Test",
            "strStarts": "01 Aug 2020",
            "strEnds": null,
            "strOrderBy": "mnoo2",
            "strContractType": "fixed",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br />",
            "intDocument": -1
        },
        {
            "strOrderType": "CR",
            "strOrderCode": "order892.11",
            "strDescription": "Test",
            "strStarts": "01 Aug 2020",
            "strEnds": null,
            "strOrderBy": "mnoo2",
            "strContractType": "fixed",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br />",
            "intDocument": -1
        },
        {
            "strOrderType": "CR",
            "strOrderCode": "order892.12",
            "strDescription": "Test",
            "strStarts": "01 Aug 2020",
            "strEnds": null,
            "strOrderBy": "mnoo2",
            "strContractType": "fixed",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br />",
            "intDocument": -1
        },
        {
            "strOrderType": "CR",
            "strOrderCode": "order892.13",
            "strDescription": "Test",
            "strStarts": "01 Aug 2020",
            "strEnds": null,
            "strOrderBy": "mnoo2",
            "strContractType": "fixed",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br />",
            "intDocument": -1
        },
        {
            "strOrderType": "CR",
            "strOrderCode": "order892.14",
            "strDescription": "Test",
            "strStarts": "01 Aug 2020",
            "strEnds": null,
            "strOrderBy": "mnoo2",
            "strContractType": "fixed",
            "strNextAction": "-> Save order data <br />-> Mark Final Order Document & SignOff <br />",
            "intDocument": -1
        }
    ]
]

现在我只需要 4 个值 OrderType,strOrderCode,strDescription,strOrderBy,intDocument

OrderModel.ts

export class OrderModel{
    Type: string
    OrderCode: string
    OrderBy: string
    Document: number
    Description: string
}

服务

export class InboxService {

  constructor(private http:HttpClient) { }

  getFAInboxDetails(): Observable<any>{
    return this.http.get<any>("http://localhost:61303/api/Inbox/FA");
  }
}

仪表板中的这种数据类型的收件箱应在组件加载时显示。

我尝试如下，但我无法得到预期的结果。

组件

export class FinasstInboxComponent implements OnInit {

  constructor(private inbox: InboxService) { }
  filter: string
  faInboxlst : OrderModel[]=[];

  ngOnInit(): void {
    this.inbox.getFAInboxDetails().subscribe(
      jsonData=>{
        this.faInboxlst= jsonData;
        console.log(this.faInboxlst);
      }
    )
  }
}

需要一个解决方案如何从 JSON 列表中提取部分 JSON 值包含很多不必要的东西

Answer 1

没有任何直接的方法来转换类型。您可能需要手动循环数组

export class OrderModel {
  Type: string;
  OrderCode: string;
  OrderBy: string;
  Document: number;
  Description: string;

  constructor(
    private type: string,
    private code: string,
    private orderBy: string,
    private document: number,
    private description: string
  ) {
    this.Type = type;
    this.OrderCode = code;
    this.OrderBy = orderBy;
    this.Document = document;
    this.Description = description;
  }
}

export class FinasstInboxComponent implements OnInit {
  ...

  ngOnInit(): void {
    this.inbox.getFAInboxDetails().subscribe(
      jsonData => {
        jsonData[0].forEach(data => {
          this.faInboxlst.push(new OrderModel(
            data['OrderType'],
            data['strOrderCode'],
            data['strDescription'],
            data['strOrderBy'],
            data['intDocument'],
          ));
        });
        console.log(this.faInboxlst);
      }
    );
  }
}