Question

我想知道我想要实现的目标是否可行。基本上我想要一个ng-grid来计算一行的小计，我已经用以下方法完成了这个：

$scope.subTotal = function(row) {

    return (row.entity.price * row.entity.qty);

};

和我的ngGrid：

$scope.gridOptions1 = {

    data: 'orderContent.products',
    multiSelect: false,
    enableCellSelection: true,
    enableRowSelection: true,
    enableCellEdit: true,
    enableSorting: false,
    columnDefs:
        [
            {field:'remove', enableCellEdit: false, displayName:'Delete', cellTemplate: '<input class="btn btn-warning btn-xs" type="button" value="remove" ng-click="removeProduct(row)" />'},
            {field:'name', displayName: 'Name', enableCellEdit: true},
            {field:'price', displayName:'Price', enableCellEdit: true},
            {field:'qty', displayName:'Quantity', enableCellEdit: true},
            {field:'getTotal()', displayName:'Subtotal', enableCellEdit: false, cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text ng-class="{failed: row.getProperty(\'total\') < 72}">{{subTotal(row)}}</span></div>'}
        ]

};

现在我有一个单元格，其中包含该行的小计，并且其工作正常。如何为所有行添加总计？

请注意，当用户点击按钮（初始状态为空）时，表格将被填充。

我试过循环遍历gridOptions1.ngGrid.entities.data对象。每次将产品添加到表中时都会触发循环/函数，但这不起作用。

这是可以实现的吗？

Answer 1

这是类似的。

http://plnkr.co/edit/LhlK1C?p=preview

 angular.forEach($scope.original_data, function (row) {
      row.getTotal = function () {
        return getSum(row.scores);
      };
    });

    $scope.gridOptions = {
            data: 'original_data',
            enableCellSelection: true,
            enableRowSelection: false,
            enableCellEdit: true,
            columnDefs: [{field:'name', displayName: 'Name', enableCellEdit: false},
            {field:'scores[0]', displayName:'Score1', enableCellEdit: true, cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text ng-class="{failed: row.getProperty(\'scores[0]\') < 18}">{{row.getProperty(col.field)}}</span></div>'},
            {field:'scores[1]', displayName:'Score2', enableCellEdit: true, cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text ng-class="{failed: row.getProperty(\'scores[1]\') < 18}">{{row.getProperty(col.field)}}</span></div>'},
            {field:'scores[2]', displayName:'Score3', enableCellEdit: true, cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text ng-class="{failed: row.getProperty(\'scores[2]\') < 18}">{{row.getProperty(col.field)}}</span></div>'},
            {field:'scores[3]', displayName:'Score4', enableCellEdit: true, cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text ng-class="{failed: row.getProperty(\'scores[3]\') < 18}">{{row.getProperty(col.field)}}</span></div>'},
            {field:'getTotal()', displayName:'Total', enableCellEdit: false, cellTemplate: '<div class="ngCellText" ng-class="col.colIndex()"><span ng-cell-text ng-class="{failed: row.getProperty(\'total\') < 72}">{{row.getProperty(col.field)}}</span></div>'}],
            enableSorting: false,
        };

如何在ng-grid表中添加总计

1 个答案: