代码之家  ›  专栏  ›  技术社区  ›  simple user

如何展开“角度材质”选项卡以显示角度栅格数据?

  •  0
  • simple user  · 技术社区  · 5 年前

    我正在使用Angular 8,并希望以以下方式在“Angular Material”选项卡内显示角度网格:-

    <mat-tab-group>
            <mat-tab label="Request Flow">
                <div class="div-main">
                    <ag-grid-angular class="ag-theme-balham grid-dimensions" [pagination]="true"
                        [gridOptions]="reqDetailGridOptions" [rowData]="reqDetailRowData" [columnDefs]="reqDetailColDef"
                        [getRowHeight]="getRowHeight" [paginationPageSize]=50 (gridReady)="onGridReady($event)">
                    </ag-grid-angular>
                    <br />                
                    <button class="button-internal">Add Subrequest</button>
                </div>
            </mat-tab>
        </mat-tab-group>
    

    问题是,即使数据存在于角度网格中,那么“角度材质”选项卡也不会扩展以使角度网格可见。它显示如下:-

    enter image description here

    然而,当我把角度网格放在“角度材质”选项卡之外时,网格显示了其全部数据。

    我试图使用“mat tab group”的“dynamicHeight”属性,但没有用。

    请在这里帮忙。

    0 回复  |  直到 5 年前
        1
  •  3
  •   simple user    5 年前

    以下步骤对我有效:-

    1. 将[dynamicHeight]=“true”添加到mat选项卡组。
    2. 添加了以下CSS:-

      .“材料”选项卡组{ 身高:100%; } .mat tab车身包装{ 弹性增长:1; }

      .mat tab主体{ 显示:flex!重要的 弯曲方向:柱; }

        2
  •  3
  •   Houssem Melliti    5 年前

    这对我很有效:

    ::ng-deep.mat-tab-body-wrapper { 
        flex-grow: 1; 
    }
    

    您必须使用::ng deep替代“mat”选项卡“body wrapper”样式