AngularJs, функция отображения результата в UI-Grid

Question

Я пытаюсь суммировать два столбца в функции, а затем отображать их результат в сетке пользовательского интерфейса.Любые идеи о том, как это сделать, а затем сохранить содержимое сетки пользовательского интерфейса в базе данных?

см. рисунок так что в моем случае: a и b связаны из базы данных, а я хочуangularjs рассчитать их сумму и добавить ее в столбец «Quantite reelle».это мой код сетки $ scope.gridOptions = {

    showGridFooter: true,
    onRegisterApi: function (gridApi) {
        $scope.gridApi = gridApi;
        gridApi.core.on.renderingComplete($scope, function () {

            $timeout(function () {
                var gridBodyElem = document.getElementById(gridApi.grid.id + '-grid-container');
                gridApi.grid.element.on('mouseup', handleGridClick);
            });
        });
    }

};
$scope.gridOptions.columnDefs = [
    { name: 'Num', enableHiding: false, enableColumnMenu: false, enableCellEdit: false, width: '5%' },
    { name: 'CodeArticle', enableHiding: false, enableColumnMenu: false, displayName: 'Code Article ', width: '10%' },
    { name: 'Ref', enableHiding: false, enableColumnMenu: false, displayName: 'Référence ', width: '10%' },
    { name: 'Designation', enableHiding: false, enableColumnMenu: false, displayName: 'Désignation ', width: '30%' },
    { name: 'Stock', enableHiding: false, enableColumnMenu: false, displayName: "Qté théorique (a)", width: '13%' },
    { name: "ajust", enableHiding: false, enableColumnMenu: false, displayName: "Ajustement (b)", width: '12%' },
    { name: "sum", enableHiding: false, enableColumnMenu: false, displayName: "Quantité Réelle(a+b)", width: '14%' },
    { name: "motif", enableHiding: false, enableColumnMenu: false, displayName: "Motif", width: '20%' }
];

`спасибо, ребята.

Answer 1

После Обучающая программа: 323 Больше примеров связывания Я создал Плунжер , используя фильтр calculateSum для вычисления суммы обоих полей.

angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid'])
  .controller('MainCtrl', MainCtrl)
  .filter('calculateSum', function () {
  return function (input, a, b) {
    return input[a]+input[b];
  };
});;

MainCtrl.$inject = ['$http', 'uiGridConstants'];

function MainCtrl($http, uiGridConstants) {
  var vm = this;

  vm.gridOptions = {
    enableFiltering: true,
    onRegisterApi: function(gridApi){
      vm.gridApi = gridApi;
    },
    columnDefs: [
      { field: 'name'},
      { field: 'num1'},
      { field: 'num2'},
      { name: 'sum', field: uiGridConstants.ENTITY_BINDING, cellFilter: 'calculateSum:"num1":"num2"' }
    ]
  };

  $http.get('https://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
    .then(function(response) {
      response.data.forEach(function(row){
        row.num1 = row.age;
        row.num2 = row.age*2;
      });
      vm.gridOptions.data = response.data;
    });
}

Answer 2

Необходимо установить для свойства поля столбца выражение.

$ scope.gridOptions.columnDefs = [
{name: "sum", enableHiding: false, enableColumnMenu: false, поле: 'CalculateSum (a, b) ', displayName: "Quantité Réelle (a + b)", ширина: '14%'}];

Здесь a & b - соответствующие имена столбцов.

Answer 3

 $scope.gridOptions.columnDefs = [
    { name: 'Num', enableHiding: false, enableColumnMenu: false, enableCellEdit: false, width: '5%' },
    { name: 'CodeArticle', enableHiding: false,field:'CodeArticle', enableColumnMenu: false, displayName: 'Code Article ', width: '10%' },
    { name: 'Ref', enableHiding: false,enableColumnMenu: false, displayName: 'Référence ', width: '10%' },
    { name: 'Designation', enableHiding: false, enableColumnMenu: false, displayName: 'Désignation ', width: '30%' },
    { name: 'Stock', enableHiding: false,field:'Stock', enableColumnMenu: false, displayName: "Qté théorique (a)", width: '13%' },
    { name: "ajust", enableHiding: false, field: 'ajust', enableColumnMenu: false, displayName: "Ajustement (b)", width: '12%' },
    { name: "sum", enableHiding: false, enableColumnMenu: false, field: 'CalculateSum(ajust,Stock)', displayName: "Quantité Réelle(a+b)", width: '14%' },
    { name: "motif", enableHiding: false, enableColumnMenu: false, displayName: "Motif", width: '20%' }
];

$scope.CalculateSum = function (ajust, Stock) {


    return ajust + Stock;
};

Answer 4

Вы можете попробовать это:

$scope.gridApi.grid.columns[column a].getAggregationValue() + 
$scope.gridApi.grid.columns[column b].getAggregationValue()