angular 4 - CDK 数据中的行样式-table

Question

我正在尝试将 cdk 数据表与自定义行视图一起使用。但目前还没有足够的信息来说明如何实现这一点。我试着浏览源代码，但无法掌握如何去做。基本上我想将每一行的数据包含在一张卡片中。我该怎么做？

Answer 1

将 class 添加到 md-row 以复制 md-card 的样式。

css:

.card{
    padding: 24px;
    border-radius: 2px;
    margin: 10px 0 10px 0;
}

html:

 <md-row *cdkRowDef="let row; columns: displayedColumns;"
          class="mat-elevation-z4 card">

angular 4 - Row styling in CDK data-table