Javascript 无法保存角度UI网格中可展开行中的行

Javascript 无法保存角度UI网格中可展开行中的行,javascript,angularjs,angular-ui,angular-ui-grid,Javascript,Angularjs,Angular Ui,Angular Ui Grid,我正在尝试将该功能与应用程序结合使用。目标是能够独立于父行保存子网格行 $scope.gridOptions = { expandableRowTemplate: 'components/grid/orderLineTemplate.html', expandableRowHeight: 150, expandableRowScope: { subGridVariable: 'subGridScopeVariable' }, columnDefs: [ {

我正在尝试将该功能与应用程序结合使用。目标是能够独立于父行保存子网格行

$scope.gridOptions = {
  expandableRowTemplate: 'components/grid/orderLineTemplate.html',
  expandableRowHeight: 150,

  expandableRowScope: {
    subGridVariable: 'subGridScopeVariable'

  },
  columnDefs: [
    {field: '_id'},
    {field: 'number'}
  ]
};

$http.get(ORDER_API)
  .success(function (data) {
    for (var i = 0; i < data.length; i++) {
      var rowScope = data[i];
      rowScope.subGridOptions = {
        appScopeProvider: $scope,
        columnDefs: [
          {field: 'amount'},
          {field: 'packageAmount'},
          {field: 'carrierAmount'}
        ],
        data: rowScope.orderLines,
        saveRow : $scope.saveRow
      }
    }
    $scope.gridOptions.data = data;
  });

$scope.gridOptions.onRegisterApi = function (gridApi) {
  $scope.gridApi = gridApi;
  gridApi.rowEdit.on.saveRow($scope, $scope.saveRow);
};

$scope.saveRow = function (order) {
  var promise = $q.defer();
  $scope.gridApi.rowEdit.setSavePromise(order, promise.promise);
  if(order.number) {
    $http.put(ORDER_API + '/' + order._id, order).success(function () {
      promise.resolve();
    }).error(function () {
      promise.reject();
    });
  }

}
});
$scope.gridOptions={
expandableRowTemplate:'components/grid/orderLineTemplate.html',
可扩展行高:150,
可扩展行范围:{
subGridVariable:“subGridScopeVariable”
},
columnDefs:[
{字段:''u id'},
{字段:'编号'}
]
};
$http.get(订单API)
.成功(功能(数据){
对于(变量i=0;i
编辑父行中的字段时,会正确调用saveRow函数。当我编辑子行中的字段时,控制台中会出现以下消息:
'在引发saveRow事件时未返回承诺,或者没有人在侦听事件,或者事件处理程序未返回承诺'

从不为扩展的子行调用存储行。

您需要注册子网格API。每个网格都有自己单独的API实例,您可以使用它进行通信:

rowScope.subGridOptions={
appScopeProvider:$scope,
columnDefs:[
{字段:'金额'},
{字段:'packageAmount'},
{字段:'carrierAmount'}
],
数据:rowScope.orderLines,
saveRow:$scope.saveRow,
onRegisterApi:函数(gridApi){
gridApi.rowEdit.on.saveRow($scope,$scope.saveRow)
}
}
这很接近,但是您正在使用appScopeProvider将我们的控制器作用域注入子网格作用域,而实际上您并不需要这样做。相反,我们可以将存储行设置为泛型,并将其绑定到所需的gridApi。
bind()
的第一个参数设置函数的
this
。我们只需传入网格对象,但不需要它。绑定的第二个参数是我们要传递的gridApi。然后在saveRow定义中,我们知道将接收正确的API作为第一个参数,然后接收rowEntity作为第二个参数

//主网格:
$scope.gridOptions.onRegisterApi=函数(gridApi){
gridApi.rowEdit.on.saveRow($scope,saveRow.bind(gridApi.grid,gridApi));
};
//子网格:
onRegisterApi:函数(gridApi){
gridApi.rowEdit.on.saveRow($scope,saveRow.bind(gridApi.grid,gridApi));
}
//更改的存储行:
函数saveRow(gridApi,rowEntity){
var promise=$q.defer();
gridApi.rowEdit.setSavePromise(rowEntity,promise.promise);
//在保存过程中假装延迟3秒,如果性别为“男性”,则返回错误
$interval(函数(){
if(rowEntity.gender==='male'){
承诺。拒绝();
}否则{
承诺。决心();
}
}, 3000, 1);
};
由于您的子网格可能有不同的保存函数,因此需要记住的主要事项是使用
onRegisterApi


下面是一个正在工作的plunker,它演示了上面的代码:

您已经在代码中创建了延迟承诺。由于error明确表示您需要返回一个承诺,您应该添加
returndeliver.promise到您的代码。我认为你也应该从else声明中返回一个承诺,以便无论如何得到承诺解决/拒绝

代码

$scope.saveRow = function(order) {
    var deferred = $q.defer();
    $scope.gridApi.rowEdit.setSavePromise(order, promise.promise);
    if (order.number) {
        $http.put(ORDER_API + '/' + order._id, order).success(function() {
            deferred.resolve();
        }).error(function() {
            deferred.reject();
        });
    } else {
        deferred.reject();
    }
    return deferred.promise; //this will return promise to caller function.
};

希望这能对你有所帮助,如果还需要什么,请告诉我。谢谢。:)

如果使用$http或$resource,则无需创建任何其他“延迟”对象,只需返回结果:

$scope.saveRow = function (order) {
    // with use $http
    var promise = $http.put(ORDER_API + '/' + order._id, order);
    // or with use $resource
    var promise = $resource(ORDER_API + '/:id').save({ id: order._id }, order).$promise;
    $scope.gridApi.rowEdit.setSavePromise(order, promise);
    return promise;
  }