ag-grid nie wypełnia się wewnątrz funkcji?

Question

Jestem nowy w użyciu agGrid, wybacz mi, jeśli znajdziesz coś głupiego. Więc wcześniej używałam Kendo Grid na angularjs, ale myśleliśmy, aby przejść do innej siatki, więc teraz próbujemy agGrid.

Poniżej znajduje się próbka aggridu, która działa poprawnie i wszystko działa. Ale, Kiedy przestawię opcje siatki wewnątrz funkcji, która będzie wywoływana na przycisku, otrzymuję OSTRZEŻENIE - opcje siatki dla ag-Grid nie zostaną znalezione. Upewnij się, że atrybut ag-grid wskazuje na poprawny obiekt w zakresie.

Nie jestem w stanie zrozumieć, jaki jest problem, ponieważ w tej funkcji opcje siatki kendo działają poprawnie, a siatka kendo jest zapełniana, ale nie jestem pewien, co robię źle w agGrid.

Uprzejmie mi pomóż.

function abc($rootScope,$scope, $state, $stateParams, $timeout, Upload, baseURL, $cookieStore, $log, errorCheckFactory) { 
    var columnDefs = [ 
     {headerName: "Make", field: "make"}, 
     {headerName: "Model", field: "model"}, 
     {headerName: "Price", field: "price"} 
    ]; 

    var rowData = [ 
     {make: "Toyota", model: "Celica", price: 35000}, 
     {make: "Ford", model: "Mondeo", price: 32000}, 
     {make: "Porsche", model: "Boxter", price: 72000} 
    ]; 

    $scope.gridOptions2 = { 
     columnDefs: columnDefs, 
     rowData: rowData, 
     enableFilter: true, 
     enableColResize: true, 
     enableSorting: true, 
     groupHeaders: true, 
     rowHeight: 22, 
     //onModelUpdated: onModelUpdated, 
     suppressRowClickSelection: true 

    }; 

}

Answer 1

Jeśli siatka nie foud swoje gridOptions że na pewno oznacza, że ​​masz literówkę w szablonie html

Sprawdź swój szablon hml musi mieć

ag-grid="gridOptions2" 

Note : jeśli używasz kontrolera ze sterownikiem w sposób, musisz powiązać zmienne na tym, a nie na $ scope.

Jeśli to nie jest ten dodatek, twój html i twoja trasa/stan/jakakolwiek definicja nawigacji.

Answer 2

Jest to problem wiążący siatkę kątową. sprawdź swój zakres zmienne gridOptions.

opcje siatki funkcja:

var columnDefs = [ 
    {displayName: "Make", field: "make"}, 
    {displayName: "Model", field: "model"}, 
    {displayName: "Price", field: "price"}, 
    {displayName: "Price2 ", field: "price2"}, 
    {displayName: "Test 4", field: "test4"}, 
    {displayName: "Test 5", field: "test5"}, 
    {displayName: "Test 6", field: "test6"}, 
]; 

var rowData = [ 
    {make: "Toyota Toyota Toyota Toyota Toyota", model: "Celica", price: 35000, price2: 145, "Test 4": "Test 4", "Test 5": "Test 5", "Test 6": "Test 6"}, 
    {make: "Acura", model: "Celica", price: 35000, price2: 145, "Test 4": "Test 4", "Test 5": "Test 5", "Test 6": "Test 6"} 
]; 

vm.gridOptions = { 
    columnDefs: columnDefs, 
    rowData: rowData 
}; 

robocza Plnkr: http://plnkr.co/edit/VRnwnXi6fzyaoJJ1YHOx?p=preview

Correct binding : <div angular-grid="main.gridOptions" class="ag-fresh" style="width: 100%"></div> 

Błąd Plnkr: http://plnkr.co/edit/zb4Vc2lw5VzRzYwsfhL7?p=preview

In-Correct Binding : <div angular-grid="main.gridOptions2" class="ag-fresh" style="width: 100%"></div> 

zmieniliśmy wiązania z gridOptions do gridOptions2 i to daje nam ostrzeżenie: VM769 angle-grid.js: 1 OSTRZEŻENIE - opcja siatki s Nie znaleziono siatki kątowej. Upewnij się, że atrybut siatka-punkt wskazuje na poprawny obiekt w zakresie.

Myślę, że powinno to rozwiać wątpliwości.

Answer 3

@ ranjeet8082 u można otworzyć siatkę W momencie kliknięcia przycisku można napisać "gridOptions" po stronie funkcji. Więc możesz załadować HTML Również w tym czasie używając ng-jeśli najpierw możesz ukryć html kliknij tylko możesz załadować html, a następnie w opcjach również załadować w funkcji kliknięcia, więc nie dostaniesz żadnego błędu. możesz sprawdzić z tym plunkerem.

enter link description here