如何在Angular中使用mat-text-column

Question

我在文档中找不到如何使用mat-text-column的示例，尤其是如何设置dataAccessor

dataAccessor: (data: T, name: string) => string; 

Answer 1

在以下示例中，

“ _renderPrice ”用作dataAccessor函数。该函数接收由dataSource定义的类型的对象作为参数，并且必须返回字符串。表中的每一行都会调用一次。

@Component({
    changeDetection: ChangeDetectionStrategy.OnPush,
    selector: 'app-orderpositions',
    template: `
  <table mat-table [dataSource]="positions">
    <mat-text-column name="price" justify="end" 
                     [headerText]="'BESTELLUNG.POSITIONEN.PREIS' | translate"
                     [dataAccessor]="_renderPrice">
    </mat-text-column>

    <tr mat-header-row *matHeaderRowDef="_displayedColumns"></tr>
    <tr mat-row *matRowDef="let row; columns: _displayedColumns;"></tr>
  </table>
  `
})
export class OrderpositionsComponent {

  @Input()
  positions: Orderposition[];

  readonly _displayedColumns: string[] = ['price'];

  _renderPrice(position: Orderposition): string {
    return `${position.price} EUR`;
  }
}

希望这会有所帮助。