javascript - 为多个子组件标签添加属性

Question

我使用使用 Material Design 的 Alfresco ADF。他们有一个数据表组件，它实际上使用了 Angular Material Table。

现在为了实现拖放功能，我需要draggable="true"在每个mat-row标签上添加。

我该如何做到这一点？我听说您应该使用 Renderer2 和 ElementRef，以便访问 DOM 元素并更改其属性。

或者还有其他方法吗？

Answer 1

在角度材料中，您可以定义这样的表格，它允许您将属性添加到mat-row元素中。

<mat-table #table [dataSource]="dataSource">

    <ng-container matColumnDef="myColumn">
      <mat-header-cell *matHeaderCellDef> My Column </mat-header-cell>
      <mat-cell *matCellDef="let element">
          Some content...
      </mat-cell>
    </ng-container>

    <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
    <mat-row draggable="true" *matRowDef="let row; columns: displayedColumns;"></mat-row>

  </mat-table>

示例结果