Angular 在ngx数据表中按对象行分组行

Angular 在ngx数据表中按对象行分组行,angular,ngx-datatable,Angular,Ngx Datatable,我有一个表,我需要用一个row属性对它进行分组,问题是这个row字段是另一个对象的对象,当我把这个对象放在表的grouping属性中时,它不起作用。 仅当属性位于外部时,它才起作用 我需要按proyecto.tipoProyecto.nombre分组 <div> <h3> Row Grouping <small> <a href="https://github.com/swimlane/ngx-datatabl

我有一个表,我需要用一个row属性对它进行分组,问题是这个row字段是另一个对象的对象,当我把这个对象放在表的grouping属性中时,它不起作用。 仅当属性位于外部时,它才起作用

我需要按proyecto.tipoProyecto.nombre分组

<div>
  <h3>
    Row Grouping
    <small>
      <a href="https://github.com/swimlane/ngx-datatable/blob/master/demo/basic/row-grouping.component.ts" target="_blank">
        Source
      </a>
    </small>
  </h3>
  <ngx-datatable #myTable class='material expandable' [rows]="rows" [groupRowsBy]="'proyecto'" [columnMode]="'force'"
    [scrollbarH]="true" [headerHeight]="50" [footerHeight]="50" [rowHeight]="40" [limit]="4"
    [groupExpansionDefault]="true">
    <!-- Group Header Template -->
    <ngx-datatable-group-header [rowHeight]="50" #myGroupHeader (toggle)="onDetailToggle($event)">
      <ng-template let-group="group" let-expanded="expanded" ngx-datatable-group-header-template>
        <div style="padding-left:5px;">
          <a href="#" [class.datatable-icon-right]="!expanded" [class.datatable-icon-down]="expanded"
            title="Expand/Collapse Group" (click)="toggleExpandGroup(group)">
            <b>Age: {{group.value[0].proyecto.tipoProyecto.nombre}}</b>
          </a>
        </div>
      </ng-template>
    </ngx-datatable-group-header>
    <!-- Row Column Template -->
    <ngx-datatable-column [width]="50" [resizeable]="false" [sortable]="false" [draggable]="false"
      [canAutoResize]="false">
      <ng-template let-row="row" let-expanded="expanded" ngx-datatable-cell-template>
        <a href="javascript:void(0)" [class.datatable-icon-right]="!expanded" [class.datatable-icon-down]="expanded"
          title="Expand/Collapse Row" (click)="toggleExpandRow(row)">
        </a>
      </ng-template>
    </ngx-datatable-column>
    <ngx-datatable-column name="Name" prop="name" editable="true"></ngx-datatable-column>
    <ngx-datatable-column name="Gender" prop="gender"></ngx-datatable-column>
    <ngx-datatable-column name="Age" prop="age"></ngx-datatable-column>
    <ngx-datatable-column name="Comment" prop="comment">
      <ng-template ngx-datatable-cell-template let-rowIndex="rowIndex" let-value="value" let-row="row" let-group="group"
        let-rowHeight="rowHeight">
        <input autofocus
          (blur)="updateValue($event, 'comment', rowIndex)"
          type="text"
          name="comment"
          [value]="value"/>
      </ng-template>
    </ngx-datatable-column>
  </ngx-datatable>
</div>

我看到您正在使用版本13。我想他们在第16版左右修复了它。我更新了图书馆,不工作了。
[
    {
        "exppayyes": 1,
        "exppayno": 0,
        "exppaypending": 0,
        "source": "Funder",
        "name": "Ethel Price",
        "gender": "female",
        "company": "Johnson, Johnson and Partners, LLC CMP DDC",
        "age": 22,
        "proyecto": {
          "codigo": "DR-4000",
          "tipoProyecto": {
            "nombre": "Controlado por documento"
          }
        },
        "comment": "test1",
        "groupcomment": "group comment test  with multiple lines of text. group comment test  with multiple lines of text."
    },
    {
        "exppayyes": 0,
        "exppayno": 1,
        "exppaypending": 0,
        "source": "Calculated",
        "name": "Wilder Gonzales",
        "gender": "male",
        "company": "Geekko",
        "age": 23,
        "proyecto": {
          "codigo": "DR-4001",
          "tipoProyecto": {
            "nombre": "Controlado por HH"
          }
        },
        "comment": "test2",
        "groupcomment": "group comment test  with multiple lines of text. group comment test  with multiple lines of text."
    }
]