如何在Project Clarity DataGrid中使用json数组

Question

所以我有两组要在Clarity Datagrid中显示的数组数据。

这是我的html

​

<div class="row">
  <div class="col-md-12">
    <div class="row">
      <div class="col-sm-12 text-right">
        <button class="btn btn-primary" (click)="openAddModal()">Take Action</button>
      </div>
    </div>
    <clr-datagrid>
      <clr-dg-column [clrDgSortBy]="'date'">Date Action Taken</clr-dg-column>
      <clr-dg-column [clrDgField]="'action'">Action Taken</clr-dg-column>
      <clr-dg-column [clrDgField]="'allegation'">Allegation Types</clr-dg-column>
      <clr-dg-column [clrDgField]="'resolution'">Resolution</clr-dg-column>

      <clr-dg-row *clrDgItems="let a of actions " [clrDgItem]="a">
        <clr-dg-cell>{{a.creatdDt}}</clr-dg-cell>
        <clr-dg-cell>{{a.actionType.actnTypeDesc}}</clr-dg-cell>
        <clr-dg-cell></clr-dg-cell>
        <clr-dg-cell></clr-dg-cell>
      </clr-dg-row>

      <clr-dg-footer>
        <clr-dg-pagination #pagination [clrDgPageSize]="10">
          {{pagination.firstItem + 1}} - {{pagination.lastItem + 1}}
          of {{pagination.totalItems}} Notes
        </clr-dg-pagination>
      </clr-dg-footer>

    </clr-datagrid>

  </div>
</div>

​

这里是我的两组数组首先这里是我的actions taken

​

[
  {
    "actnTknId": 480,
    "prvdrId": 5200833,
    "phrmcyId": null,
    "actnRsltnId": null,
    "actnTypeId": 2,
    "actnTknDt": "2015-05-06T00:00:00.000Z",
    "othrActionType": null,
    "userId": 420,
    "planSpnsrCntrctId": null,
    "creatdDt": "2018-10-04T19:50:35.000Z",
    "creatdBy": null,
    "lastUpdtdDt": null,
    "lastUpdtdBy": null,
    "actionType": {
      "actnTypeId": 2,
      "actnTypeDesc": "Termination",
      "actvSw": "1",
      "creatdDt": "2018-10-03T01:06:13.000Z",
      "creatdBy": null,
      "lastUpdtdDt": null,
      "lastUpdtdBy": null
    },
    "allegations": [
      {
        "algtnId": 122,
        "actnTknId": 480,
        "algtnTypeId": 10,
        "othrAlgtn": null,
        "creatdDt": "2018-10-03T01:08:12.000Z",
        "creatdBy": null,
        "lastUpdtdDt": null,
        "lastUpdtdBy": null
      }
    ]
  },
  {
    "actnTknId": 481,
    "prvdrId": 3192296,
    "phrmcyId": null,
    "actnRsltnId": null,
    "actnTypeId": 11,
    "actnTknDt": "2015-05-08T00:00:00.000Z",
    "othrActionType": null,
    "userId": 420,
    "planSpnsrCntrctId": null,
    "creatdDt": "2018-10-04T19:50:35.000Z",
    "creatdBy": null,
    "lastUpdtdDt": null,
    "lastUpdtdBy": null,
    "actionType": {
      "actnTypeId": 11,
      "actnTypeDesc": "Internal Data Analysis",
      "actvSw": "1",
      "creatdDt": "2018-10-03T01:06:13.000Z",
      "creatdBy": null,
      "lastUpdtdDt": null,
      "lastUpdtdBy": null
    },
    "allegations": [
      {
        "algtnId": 123,
        "actnTknId": 481,
        "algtnTypeId": 82,
        "othrAlgtn": null,
        "creatdDt": "2018-10-03T01:08:12.000Z",
        "creatdBy": null,
        "lastUpdtdDt": null,
        "lastUpdtdBy": null
      }
    ]
  }
]

​

以下是我的指控示例的数据

​

[
  {
    "algtnTypeId": 1,
    "algtnTypeDesc": "Altered Prescription",
    "actvSw": "1",
    "creatdDt": "2018-10-03T01:07:09.000Z",
    "creatdBy": null,
    "lastUpdtdDt": null,
    "lastUpdtdBy": null
  },
  {
    "algtnTypeId": 2,
    "algtnTypeDesc": "Balance Billing",
    "actvSw": "1",
    "creatdDt": "2018-10-03T01:07:09.000Z",
    "creatdBy": null,
    "lastUpdtdDt": null,
    "lastUpdtdBy": null
  }
]

​

所以我想做的是

所以我可以把<clr-dg-cell>{{al.algtnTypeDesc}}</clr-dg-cell>放在第三列。

我如何才能做到这一点呢？

Answer 1

你可以这样做：

    let allegations = [];
    //Assuming you are already having data in 'actions' variable
    actions.forEach(a => { 
      // Adding null check
      if(a.allegations && a.allegations.length) {
         allegations = allegations.concat(a.allegations);
      }
    });

所以'allegations‘变量将保存组合的数组。

快乐编码！！