渲染“角度材质”表时访问下一个上一行

时间:2018-09-26 13:59:59

标签: angular angular-material2 angular-material-table

<ng-container cdkColumnDef="weight">
  <th cdk-header-cell *cdkHeaderCellDef> Weight </th>
  <td cdk-cell *cdkCellDef="let element"> {{element.weight}} </td>
</ng-container>

我想显示{{element.weight} +上一行row.weight}的元素,如滚动总重量。语法是什么?工作样本来源取自 here

1 个答案:

答案 0 :(得分:1)

我已经通过自定义逻辑实现了总滚动重量,如果您有任何疑问,请仔细阅读并发表评论!

Result

Stack blitz link

以html

    <!-- Weight Column -->
<ng-container cdkColumnDef="weight">
    <th cdk-header-cell *cdkHeaderCellDef> Weight </th>
    <td cdk-cell *cdkCellDef="let element"> {{getElementWeight(element)}} </td>
    <!--  <td cdk-cell *cdkCellDef="let element"> {{element.weight}} </td> -->
</ng-container>

在ts

declare global {
interface Array < T > {
    getSummedWeight(): any;
    containsElement(e: any): any;
     }
  }

    custom:any = [];
getElementWeight(e) {
    if (this.custom.containsElement(e)) {
        this.custom = [];
        console.log("########contains#####")
    }
    this.custom.push({
        'position': e.position,
        'name': e.name,
        'weight': e.weight,
        'newweight': e.weight + (this.custom.length == 0 ? 0 : this.custom.getSummedWeight())
    })
    console.log(this.custom)
    return this.custom.length == 0 ? 0 : this.custom[this.custom.length - 1].newweight

}


  if (!Array.prototype.getSummedWeight) {
Array.prototype.getSummedWeight = function(): any {
    let totalWeight = this.length == 1 ? this[this.length - 1].weight :
        this[this.length - 1].weight;
    return totalWeight;
    }
}
  if (!Array.prototype.containsElement) {
Array.prototype.containsElement = function(e): any {
    for (let i = 0; i < this.length; i++) {
        if (this[i].position === e.position)
            return true;
    }
    return false;
   }
 }