首页 > 解决方案 > 如何对不同行中的列数据求和并使用 Typescript 绑定到文本框

问题描述

我有一个数据网格,我想在另一个地方的文本框中显示不同行中列的总和。

         OverTimeDetailGridColumns: kendo.ui.GridColumn = [
            { field: "TransactionDetailId", hidden: true },
            { field: "Row", width: "5%", filterable: false },
            {
                field: "TimeDuration",
                width: "20%",
                filterable: {
                    cell: {
                        showOperators: false,
                        operator: "contains",
                        delay: 2000
                    }
                }
            },
           }

        OverTimeDetailList: OverTimeDetailViewModel[] = [];
        OverTimeDetailGridDataSource = new kendo.data.DataSource({
            data: this.OverTimeDetailList,
            serverPaging: false,
            autoSync: false,
            pageSize: 10,
            batch: false,
            serverSorting: false,
            serverFiltering: false,
        });

“TimeDuration 是一个字符串类型,它显示小时。我想在 UI 的 HTML 代码中显示“TimeDuration”的总和:

                 <fieldset class="form-group col-md-12 col-xs-12 pull-right">
                   <label >Total Sum</label>
                   <input type="text"
                   value="{{vm.Sum}}"
                   class="form-control"
                   readonly />
                 </fieldset>

我有一个变量并声明了一个对 this.TimeDuration 求和的方法,但它不起作用。如果可以,请你帮助我。

标签: htmlangularjstypescriptsumkendo-grid

解决方案


let TimeArray=["01:00:34","02:00:34","01:50:34","04:30:34","01:20:34"]

function timestrToSec(timestr) {
  var parts = timestr.split(":");
  return (parts[0] * 3600) +
         (parts[1] * 60) +
         (+parts[2]);
}

function pad(num) {
  if(num < 10) {
    return "0" + num;
  } else {
    return "" + num;
  }
}

function formatTime(seconds) {
  return [pad(Math.floor(seconds/3600)),
          pad(Math.floor(seconds/60)%60),
          pad(seconds%60),
          ].join(":");
}

let totalTime=TimeArray.reduce((prev, current) => {
  return formatTime(timestrToSec(prev) + timestrToSec(current))
}, "00:00:00");

console.log(totalTime)


推荐阅读