2016-06-13 2 views
4

Я пытаюсь динамически добавлять столбцы в ui-grid, а также назначая данные. Первый раз, сетка работает хорошо. Но, когда я пытаюсь динамически менять столбцы и данные, он работает не так, как ожидалось.angularjs UI grid - динамически назначать столбцы и данные

$scope.myfunc = function() { 

alert("Rebinding the data"); 
$scope.gridOptions = {}; 

$scope.gridOptions.columnDefs.push({ 
name: 'firstName' 
    }); 
    $scope.gridOptions.columnDefs.push({ 
name: 'lastName' 
    }); 
    $scope.gridOptions.columnDefs.push({ 
name: 'company' 
    }); 
    $scope.gridOptions.columnDefs.push({ 
name: 'employed' 
    }); 

    alert("added new columns"); 
    $scope.gridOptions.data = data1; 

    $scope.gridApi.grid.refresh(); 
}; 

пожалуйста, проверьте plunkr

Может кто-нибудь взглянуть на этот вопрос и предложить мне, как это сделать?

ответ

3

я думаю, что вы можете удалить код: $scope.gridOptions = {};

последняя plunker

второй data1 должен быть выдвинут на первый data

Я изменил plunker с последним кодом, пожалуйста проверка Это!

$scope.myfunc = function() 
    { 

    alert("Rebinding the data"); 
    $scope.gridOptions.columnDefs = new Array(); 

    $scope.gridOptions.columnDefs.push({ 
    field: 'firstName' 
     }); 
     $scope.gridOptions.columnDefs.push({ 
    field: 'lastName' 
     }); 
     $scope.gridOptions.columnDefs.push({ 
    field: 'company' 
     }); 
     $scope.gridOptions.columnDefs.push({ 
    field: 'employed' 
     }); 

     alert("added new columns"); 
     $scope.gridOptions.data = data1; 

    /* for(var i=0; i<$scope.gridOptions.data.length; i++){ 
     $scope.gridOptions.data[i].firstName = data1[i].firstName; 
     $scope.gridOptions.data[i].lastName = data1[i].lastName; 
     $scope.gridOptions.data[i].company = data1[i].company; 
     $scope.gridOptions.data[i].employed = data1[i].employed; 
     } */ 


     $scope.gridApi.grid.refresh(); 
    }; 

, если вы хотите, чтобы удалить старые колонки, можно использовать

$scope.gridOptions.columnDefs = new Array();

, а затем обновить данные с помощью:

$scope.gridOptions.data = data1; 

$scope.gridApi.grid.refresh(); 
+0

спасибо за обновление. но я хочу удалить старые столбцы и данные, как только я нажму на действие кнопки повторной отправки. Можете ли вы мне помочь? – NewBuddy

+0

Я обновил плункер и приведенный выше код, вы можете использовать $ scope.gridOptions.columnDefs = new Array(); а затем используйте $ scope.gridOptions.data = data1; –

+0

Помогите решить этот вопрос? –

Смежные вопросы