根据角色隐藏角垫表格列

时间:2019-05-05 19:20:29

标签: typescript hide angular7 roles mat-table

我有一个angular 7项目,该项目要求根据用户角色隐藏一列。因此,如果角色是经理,则称为"Details"的列将消失。我可以成功隐藏该列,但遇到此错误:

    ERROR Error: Could not find column with id "Details".
    at getTableUnknownColumnError (table.es5.js:671)
    at table.es5.js:2443
    at Function.from (<anonymous>)
    at MatTable.push../node_modules/@angular/cdk/esm5/table.es5.js.CdkTable._getCellTemplates (table.es5.js:2439)
    at MatTable.push../node_modules/@angular/cdk/esm5/table.es5.js.CdkTable._renderRow (table.es5.js:2375)
    at table.es5.js:2189
    at Array.forEach (<anonymous>)
    at MatTable.push../node_modules/@angular/cdk/esm5/table.es5.js.CdkTable._forceRenderHeaderRows (table.es5.js:2189)
    at MatTable.push../node_modules/@angular/cdk/esm5/table.es5.js.CdkTable.ngAfterContentChecked (table.es5.js:1510)
    at callProviderLifecycles (core.js:22402)

我认为问题是由ts文件中的列声明引起的。 Details列已被声明,但由于该列中的角色指令(即*appHasRole="['Manager']")而找不到。我提供了以下代码。欢迎有任何想法的人发表评论!

  

角度html

  <mat-table
          #Table
          [dataSource]="DataSource"
        >
 <ng-container matColumnDef="Details" *appHasRole="['Manager']">
            <mat-header-cell *matHeaderCellDef mat-sort-header class="title">
              Details
            </mat-header-cell>
            <mat-cell *matCellDef="let row">
              <mat-icon
                style="cursor: pointer"
                (click)="openDialogeBox(row)"
                >icon</mat-icon
              >
            </mat-cell>
          </ng-container>

     <mat-header-row
            *matHeaderRowDef="columnsNames
          ></mat-header-row>
          <mat-row
            *matRowDef="let row; columns: columnsNames"
            (click)="selectedRows(row)"
          ></mat-row>
        </mat-table>

  

角度ts文件

 columnsNames: string[] = [

    "Name",
    "Address",
    "Details",
  ];

0 个答案:

没有答案