【问题标题】:ngx-datatable inside other ngx-datatable rowDetail?其他ngx-datatable rowDetail中的ngx-datatable?
【发布时间】:2017-09-22 12:48:45
【问题描述】:

我是 Angular 4 和 ngx-datatable 的新手,但我遇到了困难。现在,我有一个带有简单 rowDetail 的 ngx 数据表,就像它显示的 here 一样。问题是我需要rowDetail 来包含另一个ngx-datatable,我不知道这是否可能。

谁能给我一些线索?

提前致谢!

【问题讨论】:

    标签: angular ngx-datatable


    【解决方案1】:

    好吧,终于没什么大不了了。我在这里留下一个此类表格的示例模板,以供像我一样陷入困境的人们:

      <ngx-datatable #myTable class="material expandable" [rows]="rows" columnMode="flex" [headerHeight]="headerHeight"
        [footerHeight]="footerHeight" [rowHeight]="rowHeight" [loadingIndicator]="loadingIndicator" [externalPaging]="true"
        [count]="page.totalElements" [offset]="page.pageNumber" [limit]="page.size" (page)='setPage($event)'>
        <ngx-datatable-row-detail [rowHeight]="150" #myDetailRow (toggle)="onDetailToggle($event)">
          <ng-template let-row="row" let-expanded="expanded" ngx-datatable-row-detail-template>
            <div>
              <ngx-datatable #myDaughter columnMode="flex" [headerHeight]="falsey" [rows]="getDetailRows(row)"
                [footerHeight]="footerHeight" [rowHeight]="rowHeight" [loadingIndicator]="loadingIndicator" [externalPaging]="true"
                [count]="detailRows.length" [offset]="page.pageNumber" [limit]="page.size" (page)='setPage($event)'>
                <ngx-datatable-column name="A" prop="col_a"></ngx-datatable-column>
                <ngx-datatable-column name="B" prop="col_b"></ngx-datatable-column>
                <ngx-datatable-column name="C" prop="col_c"></ngx-datatable-column>
              </ngx-datatable>
            </div>
          </ng-template>
        </ngx-datatable-row-detail>
        <ngx-datatable-column [sortable]="false" [draggable]="false">
          <ng-template let-row="row" let-expanded="expanded" ngx-datatable-cell-template>
            <button md-icon-button [class.datatable-icon-right]="!expanded" [class.datatable-icon-down]="expanded" title="Expand/Collapse Row"
              (click)="toggleExpandRow(row)"></button>
          </ng-template>
        </ngx-datatable-column>
        <ngx-datatable-column name="A" prop="col_a"></ngx-datatable-column>
        <ngx-datatable-column name="B" prop="col_b"></ngx-datatable-column>
        <ngx-datatable-column name="C" prop="col_c"></ngx-datatable-column>
      </ngx-datatable>
    

    【讨论】:

    • 我还必须确保我的行详细信息位于任何自定义列之前,否则行详细信息中的数据表由于某种原因不会显示。
    • @Nemezih,你能提供一个小提琴来证明你的回答吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-12-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-03-17
    • 2018-09-06
    相关资源
    最近更新 更多