Parsowanie danych JSon w AngularJS z $ http call

Question

Jestem bardzo nowy zarówno w tworzeniu stron internetowych, jak i AngularJS. Próbuję napisać stronę internetową, która automatycznie aktualizuje swoje informacje w oparciu o pliki JSon znajdujące się na moim serwerze. Mogę pobrać dane json, ale nie mogę przetworzyć danych przychodzących. Sprawdziłem poprawność danych json tylko po to, aby upewnić się, że poprawnie je piszę, ale za każdym razem, gdy wyświetlam je na stronie, wyświetlane są tylko jako pojedynczy ciąg. Nie mogę uzyskać dostępu do poszczególnych członków. Moja fabryka i kontroler znajdują się poniżej. Każda pomoc będzie bardzo ceniona!

var MyController = function($scope, $log, MyFactory) { 
    $scope.notes =[]; 

function init() { 
    MyFactory.getNotes() 
     .success(function(notes){ 
      $scope.notes = JSON.parse(notes); 
     }) 
     .error(function(data, status, headers, config) { 
       $log.log(data.error + ' ' + status); 
      }); 
} 

    init(); 

angular.module('MyApp') 
    .controller('MyController', MyController); 
}; 

i fabryka:

var MyFactory = function($http) { 
    var factory = {}; 
    factory.getNotes = function() { 
     return $http.get('/ci/data.json'); 
    }; 
return factory; 
}; 

angular.module('MyApp').factory('MyFactory', 
            MyFactory); 

Przyznam kod i pytanie jest surowy, ale ja dopiero się rozpoczął. Każda dodatkowa pomoc dotycząca architektury i stylu również byłaby doceniana! Z góry dziękuję!

Answer 1

1. Nie trzeba analizować odpowiedzi jako json. Jeśli plik źródłowy podaje prawidłowy json, kątowy zna jego json.

2. W swoim kontrolerze, spróbuj console.log($scope.notes). Jeśli korzystasz z Google Chrome, wyniki w postaci json zostaną wydrukowane w konsoli, o której wiesz, że działa Twój factory.

3. Użyj wartości kątowej forEach do iteracji wyników, aby coś z nią zrobić.

   angular.forEach($scope.notes, function(note) { 
       console.log(note); 
   }); 
   

Answer 2

Nie trzeba przeanalizować .. wystarczy użyć $ scope.notes w was pętli

<div ng-repeat="note as notes"> 
    <p>{{name}}</p> 
    <p>{{age}}</p> 
</div> 

Answer 3

Można użyć angular.fromJson(jsondata) analizować wynik http. Wcześniej otrzymywałem nieprawidłowe dane JSON z odpowiedzi http, niektóre znakibyły tam w danych json, więc parsowałem używając tego i to działało dla mnie, usunęło wszystkie te nieprawidłowe znaki z moich danych json.

Answer 4

Dla tych z Was, którzy nadal mogą potrzebować tego, odpowiedź Suresh jest w dobrym kierunku, ale że kod był bardzo źle (przynajmniej dla Kątowymi 1)

Więc próbując analizować dane, takie jak:

{"1":{"id":"1","owner":"1","name":"Mearns Server","description":"This is my test server.","version":"1.11","type":"0","ip":"test.com","port":"25565"},"2":{"id":"2","owner":"1","name":"Test Server","description":"This is my test server.","version":"1.0","type":"2","ip":"test.com","port":"6969"} 

użyłem następujące żądania GET:

.controller('serversController', function($scope, $http){ 
    $http.get("/dashboard/api/?action=getServers&key=") 
    .then(function(response){ 
    $scope.servers = response.data; 
    }); 
}); 

i następujący kod HTML:

<div ng-repeat="server in servers"> 
    <p>{{server.id}}</p> 
    <p>{{server.name}}</p> 
    <p>{{server.version}}</p> 
</div>