Angular JS: Dane JSON nie są wyświetlane w ng-Grid

Question

Stworzyłem aplikację MVC 4.0 za pomocą Web API, która zwraca dane w formacie JSON (serializuję obiekt do json przy użyciu NewtonSoft.Json) i próbuję powiązać dane w ng -Krata. Ja odbierania danych w następującej formie:

"[{\"Name\":\"FIRST_NAME\",\"Value\":\"FIRST_NAME\"},{\"Name\":\"CURRENT_DATE_TIME\",\"Value\":\"CURRENT_DATE_TIME\"},{\"Name\":\"CLIENTID\",\"Value\":\"CLIENTID\"},{\"Name\":\"CALLMODE\",\"Value\":\"CALLMODE\"}, {\"Name\":\"new 321\",\"Value\":null}]" 

Kiedy próbowałem przypisać same danych: NG-Grid, każdy char zaludnionych na innym wierszu. Poniżej znajduje się javascript Pisałem:

var guidesRespApp = angular.module('guidesRespApp', ['ngGrid']); 

//Get Data from restful API. 
guidesRespApp.controller('MyCtrl', function ($scope, $http) { 
    $http.get('/api/datadictionary').success(function (thisdata) { 
      $scope.myData = thisdata; 
    }); 

    $scope.filterOptions = { 
     filterText: '', 
     useExternalFilter: true, 
    }; 


    //Setting grid options 
    $scope.gridOptions = { 
     data: 'myData', 
     multiSelect: true, 
     filterOptions: { filterText: '', useExternalFilter: false }, 
     enableRowReordering: false, 
     showGroupPanel: false, 
     maintainColumnRatios: false, 
     groups: [], 
     showSelectionCheckbox: true, 
     showFooter: true, 
     enableColumnResize: true, 
     enableColumnReordering: true 
    }; 


// $scope.totalFilteredItemsLength = function() { 
//  //return self.filteredRows.length; 
//  }; 

}); 

Jeśli ręcznie przypisany jak poniżej, dane jest uzyskiwanie wyświetlane w siatce:

$scope.myData = [{"Name":"FIRST_NAME","Value":"FIRST_NAME"},{"Name":"CURRENT_DATE_TIME","Value":"CURRENT_DATE_TIME"},{"Name":"CLIENTID","Value":"CLIENTID"},{"Name":"CALLMODE","Value":"CALLMODE"}]; 

może ktoś proszę mi pomóc zrozumieć, jak to naprawić? Również chciałem wyświetlić liczbę przefiltrowanych elementów, gdy wprowadzam wartości w polu tekstowym.

Answer 1

Jak wspomniano w artykule http://angular-ui.github.io/ng-grid/, dane wyświetlane w siatce są tablicami typu, a każdy element w tej tablicy jest odwzorowany na wyświetlany wiersz. Więc mój zmodyfikowany kod jak poniżej i pracował dla mnie:

$http.get('http://localhost:12143/api/datadictionary').success(function (thisdata) { 
    //Convert data to array. 
    var myData = $.parseJSON(JSON.parse(thisdata)); 
    $scope.myData = myData; 
}); 

nawet var myData = $.parseJSON(angular.fromJson(thisdata)); również działa. Po prostu musimy najpierw przeanalizować dane (do tego użyłem JSON.parse()), a następnie przekonwertować do tablicy (w tym celu użyłem $.parseJSON()).

Answer 2

Spróbuj zmienić zwrotnego dostać się do jednego z następujących powodów:

$http.get('/api/datadictionary').success(function (thisdata) { 
     $scope.myData = JSON.parse(thisdata); 
     // or 
     $scope.myData = angular.fromJson(thisdata); 
}); 

Reference to w odniesieniu do tego, jak WebAPI wraca JSON. ASP.NET WebAPI: How to control string content returned to client?