css - 修复垫子对话框上垫子表的标题不起作用

Question

<div *ngIf="this.v_type != 'NULL'">
  <div class="example-container mat-elevation-z8">
    <table mat-table [dataSource]="voucherdataSource">
      <ng-container matColumnDef="Credit_Card_No">
        <th mat-header-cell *matHeaderCellDef>Credit Card Number</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Credit_Card_No}}</td>
      </ng-container>
      <ng-container matColumnDef="Seller_Name">
        <th mat-header-cell *matHeaderCellDef>Seller Name</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Seller_Name}}</td>
      </ng-container>
      <ng-container matColumnDef="Account_No">
        <th mat-header-cell *matHeaderCellDef>Account Number</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Account_No}}</td>
      </ng-container>
      <ng-container matColumnDef="Buyer_Name">
        <th mat-header-cell *matHeaderCellDef>Buyer Name</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Buyer_Name}}</td>
      </ng-container>
      <ng-container matColumnDef="GST_No">
        <th mat-header-cell *matHeaderCellDef>GST Number</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.GST_No}}</td>
      </ng-container>
      <ng-container matColumnDef="Invoice_No">
        <th mat-header-cell *matHeaderCellDef>Invoice Number</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Invoice_No}}</td>
      </ng-container>
      <ng-container matColumnDef="Amount_Value">
        <th mat-header-cell *matHeaderCellDef>Amount Value</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Amount_Value}}</td>
      </ng-container>
      <ng-container matColumnDef="Voucher_Type">
        <th mat-header-cell *matHeaderCellDef>Voucher Type</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Voucher_Type}}</td>
      </ng-container>
      <ng-container matColumnDef="financial_year">
        <th mat-header-cell *matHeaderCellDef>Financial Year</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.financial_year}}</td>
      </ng-container>
      <ng-container matColumnDef="Voucher_Date">
        <th mat-header-cell *matHeaderCellDef>Voucher Date</th>
        <td mat-cell *matCellDef="let voucher">{{voucher.Voucher_Date}}</td>
      </ng-container>
      <ng-container matColumnDef="Filepath">
        <th mat-header-cell *matHeaderCellDef>Local Filepath</th>
        <td mat-cell *matCellDef="let voucher">
          <a mat-icon-button href=" {{ voucher.Filepath }} " target="_blank">
            <mat-icon>picture_as_pdf</mat-icon>
          </a>
        </td>
      </ng-container>
      <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></tr>
      <tr mat-row *matRowDef="let row;columns:displayedColumns"></tr>
    </table>
  </div>
</div>

我需要一个对话框上的表格的固定标题，我可以看到表格但标题不固定。在最后的第 5 行中，我使用了sticky:true，它应该修复表格的标题，但它没有修复并随着表格滚动。

标签： cssangularangular-materialangular8angular-material-8