2015-03-29 14 views
6

Próbuję użyć funkcji row saving w połączeniu z expandable grid. Celem jest umożliwienie zapisywania wierszy pod-siatkami, niezależnie od wiersza nadrzędnego.Nie można zapisać wiersza w rozszerzalnym wierszu w interfejsie kątowym Siatka

$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(); 
    }); 
    } 

} 
}); 

Funkcja saveRow jest wywoływana poprawnie podczas edycji pola w wierszu nadrzędnym. Kiedy edytuję pole w podrzędnym wierszu, pojawia się następujący komunikat w konsoli;
"Obietnica nie została zwrócona, gdy zdarzenie saveRow zostało podniesione, nikt nie słucha zdarzenia lub program obsługi zdarzeń nie zwrócił obietnicy"
SaveRow nigdy nie jest wywoływany z rozwiniętym podrzędnym.

Odpowiedz

3

Musisz zarejestrować interfejsy API subgrid. Każda sieć ma własną instancję oddzielny API, który służy do komunikowania się z nim:

rowScope.subGridOptions = { 
    appScopeProvider: $scope, 
    columnDefs: [ 
    {field: 'amount'}, 
    {field: 'packageAmount'}, 
    {field: 'carrierAmount'} 
    ], 
    data: rowScope.orderLines, 
    saveRow : $scope.saveRow, 
    onRegisterApi: function (gridApi) { 
    gridApi.rowEdit.on.saveRow($scope, $scope.saveRow) 
    } 
} 

To blisko, ale jesteś wstrzykiwanie zakres naszej kontrolera do subgrid zakresie z appScopeProvider, która tak naprawdę nie trzeba zrobić . Zamiast tego możemy uczynić saveRow generycznym i powiązać go z siatką, którą chcemy. Pierwszy argument bind() ustawia dla tej funkcji this. Przekażemy tylko obiekt siatki, ale nie będziemy go potrzebować. Drugim argumentem do wiązania będzie siatka, którą chcemy przekazać. Następnie w definicji saveRow wiemy, że otrzymamy właściwy interfejs API jako pierwszy argument, a następnie wierszExity jako drugi argument.

// Main grid: 
$scope.gridOptions.onRegisterApi = function(gridApi) { 
    gridApi.rowEdit.on.saveRow($scope, saveRow.bind(gridApi.grid, gridApi)); 
}; 

// Subgrids: 
onRegisterApi: function(gridApi) { 
    gridApi.rowEdit.on.saveRow($scope, saveRow.bind(gridApi.grid, gridApi)); 
} 

// Altered saveRow: 
function saveRow(gridApi, rowEntity) { 
    var promise = $q.defer(); 
    gridApi.rowEdit.setSavePromise(rowEntity, promise.promise); 

    // fake a delay of 3 seconds whilst the save occurs, return error if gender is "male" 
    $interval(function() { 
    if (rowEntity.gender === 'male'){ 
     promise.reject(); 
    } else { 
     promise.resolve(); 
    } 
    }, 3000, 1); 
}; 

Ponieważ prawdopodobnie będziesz mieć funkcję różnych oszczędzania na subgrids Najważniejszą rzeczą do zapamiętania jest to, aby zarejestrować „saveRow” zdarzenie na nich wszystkich z onRegisterApi

Oto plunker roboczego wykazując powyższy kod : http://plnkr.co/edit/52mp9C?p=preview

1

Utworzono już odroczoną obietnicę w swoim kodzie. Ponieważ błąd wyraźnie mówi, że musisz zwrócić obietnicę, powinieneś dodać do swojego kodu return deferred.promise;. Myślę, że powinieneś także zwrócić obietnicę z innego zdania, aby uzyskać obietnicę rozwiązania/odrzucenia.

Kod

$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. 
}; 

Nadzieja to może pomóc, daj mi znać, jeśli wymagane jest coś innego. Dzięki. :)

2

Jeśli używasz kątowa $ $ http lub zasób, nie trzeba tworzyć żadnych innych „odroczone” przedmioty, po prostu wrócić wynik:

$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; 
    } 
Powiązane problemy