AngularJS ui-grid - Управление ошибками в режиме редактирования

Question

Этот вопрос для меня трудно, так как я новичок в AngularJS и многих его концепциях. Я использую ui-grid. У меня есть on.afterCellEdit, который вызывает угловую фабрику (делает PUT на моем REST API).

Я хотел бы обрабатывать ошибки и таймауты, возвращая значение в ячейке и предоставляя обратную связь пользователю. Как это можно сделать?

завод:

angular.module('angularApp') 
     .factory('serviceAjax', function serviceAjax($http) { 

    function putTransactionSuccessFn(data, status, headers, config) { 
    console.log("Vla ça marche"); 
    } 

    function putTransactionErrorFn(data, status, headers, config) { 
    console.log(data); 
    console.log(data.config); 
    console.log(headers); 
    console.log(config); 
    } 

    // Public API here 
    return { 
    getTransactions: function(client, transaction){ 
     return $http.get("http://localhost:8000/api/transaction/"+client+"/" + transaction); 
    }, 
    putTransaction: function(row){ 
     return $http.put("http://localhost:8000/api/trcompinfos/"+row.pk+"/",row).then(putTransactionSuccessFn,putTransactionErrorFn); 
    } 
    } 
}); 

контроллер:

angular.module('angularApp') 
     .controller('TransactionsCtrl', function ($scope, $routeParams, serviceAjax, uiGridGroupingConstants) { 
    $scope.client = $routeParams.client; 
    $scope.transaction = $routeParams.transaction; 
    $scope.table = { 
    enableFiltering: true, 
    enableGridMenu: true, 
    exporterMenuPdf: false, 
    exporterCsvFilename: $scope.client + '_' + $scope.transaction + '.csv', 
    onRegisterApi: function(gridApi) { 
     $scope.gridApi = gridApi; 
     gridApi.edit.on.afterCellEdit($scope, $scope.saveRow); 
     $scope.gridApi.grid.registerDataChangeCallback(function() { 
     $scope.gridApi.treeBase.expandAllRows(); 
     }); 
    }, 

    } 
    var loadTransactions = function(){ 
    serviceAjax.getTransactions($scope.client,$scope.transaction).success(function(data){ 
     $scope.results = data; 
     var header_cols_before = [{name:'Date',field:'report_date',grouping: { groupPriority: 0 }, sort: { priority: 0, direction: 'desc' }}, 
           {name:'SID', field:'target.sid', grouping: { groupPriority: 1}, sort: {priority: 1, direction: 'asc'}}, 
           {name:'ID', field:'pk'} ]; 
     var header_cols_after = [ {name:'Current Status' ,field:'current_status', editableCellTemplate: 'ui-grid/dropdownEditor', editDropdownValueLabel: 'Current Status', 
     editDropdownOptionsArray: [ 
     { id: 'E', 'Current Status': 'Error' }, 
     { id: 'N', 'Current Status': 'No error' }, 
     { id: 'W', 'Current Status': 'Warning' }, 
     { id: 'A', 'Current Status': 'Acknowledged Error' }],cellFilter: 'mapCurStat'}, 
           {name:'Analysis', field:'analysis'}, 
           {name:'Action',field:'action'}, 
           {name:'Who',field:'who'}, 
           {name:'Notes',field:'notes'}]; 
     var header_cols_middle = []; 
     if (data.length > 0)  
     { 
      for (var key in data[0]) 
      { 
       if (typeof data[0][key] == 'object' && key == 'tr_comp') 
       { 
        for (var key_inner in data[0][key]) 
        { 
         if (typeof data[0][key][key_inner] == 'object' && key_inner == 'custom_cols') 
         { 
          for (var key_inner_inner in data[0][key][key_inner]) 
          { 
           header_cols_middle.push({name:key_inner_inner.substring(3), field:key+'.'+key_inner + '.' + key_inner_inner}); 
          } 
         } 
        } 
       } 
      } 
     } 
     $scope.header_cols = header_cols_before.concat(header_cols_middle).concat(header_cols_after) 
     $scope.table.data = $scope.results; 
     $scope.table.columnDefs = $scope.header_cols; 
    }); 
    $scope.saveRow = function(rowEntity) { 
     var promise = serviceAjax.putTransaction(rowEntity); 
     console.log(promise); 
    }; 
    }; 
    loadTransactions(); 
}) 
.filter('mapCurStat', function() { 
    var mapCurStatHash = { 
    'E': 'Error', 
    'N': 'No error', 
    'W': 'Warning', 
    'A': 'Acknowledged Error' 
    }; 

    return function(input) { 
    if (!input){ 
     return ''; 
    } else { 
     return mapCurStatHash[input]; 
    } 
    }; 
}); 

Answer 1

Нашел!

$scope.saveRow = function(rowEntity,rowInfo,newValue,oldValue) { 
     //$scope.gridApi.edit.raise.cancelCellEdit(rowEntity); 
     var promise = serviceAjax.putTransaction(rowEntity).then(
     function(response){// success 
      snackbar.add("success", "Modification saved." , 1000); 
     }, 
     function(response){//error 
      var error_reason = "" 
      if (response.status == -1) 
      { 
       error_reason = "Connexion to server lost."; 
      } 
      else if (response.status == 403) 
      { 
       error_reason = "You are no more connected."; 
      } 
      else 
      { 
       error_reason = response.statusText + " - " + response.data.action; 
      } 
      console.log(response) 
      $scope.gridApi.edit.raise.cancelCellEdit(rowEntity, rowInfo, newValue, oldValue); 
      var message = "Modification of field <emph>" + rowInfo['field'] + "</emph> to value \"" + newValue + 
      "\" has failed. Reverted to \"" + oldValue + "\" <br /> Reason : " + error_reason + " <br /> Impacted line : " + JSON.stringify(rowEntity) 
      snackbar.add("danger", message , 10000); 
      console.log(rowEntity) 
     } 
    ); 

    }; 
    $scope.cancelRow = function(rowEntity,rowInfo, newValue, oldValue) { 
     rowEntity[rowInfo['field']] = oldValue; 
     console.log(rowEntity[rowInfo['field']]) 
    };