Parsen von JSon-Daten in AngularJS von $ http Call

Question

Ich bin sehr neu in beiden Web-Entwicklung und AngularJS. Ich versuche eine Webseite zu schreiben, die automatisch ihre Informationen basierend auf JSon-Dateien aktualisiert, die auf meinem Server liegen. Ich kann die JSON-Daten abrufen, aber ich kann die eingehenden Daten nicht parsen. Ich habe die JSON-Daten überprüft, nur um sicherzustellen, dass ich sie richtig geschrieben habe, aber wenn ich sie auf der Website zeige, werden sie nur als eine einzige Zeichenfolge angezeigt. Ich kann nicht auf die einzelnen Mitglieder zugreifen. Meine Fabrik und Controller sind unten. Jede Hilfe würde sehr geschätzt werden !!

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

Und die Fabrik:

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

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

Ich gebe den Code und die Frage ist grob, aber ich habe gerade erst begonnen. Jede zusätzliche Hilfe zu Architektur und Stil wird ebenfalls geschätzt! Danke im Voraus!

Answer 1

1. Sie müssen die Antwort nicht als JSON parsen. Wenn die Quelldatei Ihnen gültiges JSON gibt, kennt angle sein JSON.

2. Versuchen Sie in Ihrem Controller console.log($scope.notes). Wenn Sie Google Chrome verwenden, erhalten Sie die json Ergebnisse ziemlich in der Konsole gedruckt, die Sie wissen, dass Ihre factory funktioniert.

3. Verwenden Sie einen Winkel forEach, um das Ergebnis zu durchlaufen, um etwas damit zu tun.

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

Answer 2

keine Notwendigkeit .. zu analysieren nur Ihre $ scope.notes in Sie Schleife verwenden

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

Answer 3

Sie angular.fromJson(jsondata) http Ergebnis zu analysieren, verwenden können. Zuvor erhielt ich ungültige JSON-Daten von HTTP-Antwort, einige "\ Zeichen waren dort in den JSON-Daten, so dass ich mit diesem analysiert und es funktionierte für mich, entfernte es alle diese ungültigen Zeichen aus meinen JSON-Daten.

Answer 4

Für diejenigen, die dies noch benötigen, ist Suresh Antwort in der richtigen Richtung, aber dieser Code war völlig falsch (zumindest für Angular 1)

Während also versuchen, Daten zu analysieren, wie zum Beispiel:

{"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"} 

ich verwendet, um die folgende GET-Anfrage:

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

und die folgende HTML:

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