RESTful Web Service mit AngularJS konsumieren

Ich gehe ein paar Tutorials über die Verwendung einer API mit AngularJS durch ... Ich stehe auf Probleme beim Versuch, {{greeting.id}} und {{greeting.content}} auszuführen. Ich würde annehmen, dass dies die Ergebnisse rendert, aber sie sind nicht auf meinem Bildschirm sichtbar. HierRESTful Web Service mit AngularJS konsumieren

ist mein CodePen:http://codepen.io/ChaseHardin/pen/bprObb/

https://spring.io/guides/gs/consuming-rest-angularjs/

http://codepen.io/theshravan/pen/mnbcx

Warum nicht meine ID und Content-Anzeige auf der Benutzeroberfläche; ist das Problem mit meinem HTML oder JavaScript?

HTML

<html> 
<head> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script> 
</head> 
<body ng-app="myApp"> 
    <div ng-controller="GreetingController" class="container"> 
    <h1>Greeting</h1> 
    <hr/> 
    <div ng-repeat="greeting in greetings" class="col-md-6"> 
     <h4>{{greeting.id}}</h4> 
     <p>{{greeting.content}}</p> 
    </div> 
    </div> 
</body> 
</html>

JavaScript

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

myApp.controller("GreetingController", function ($scope, $http) { 
    $http.get('http://rest-service.guides.spring.io/greeting'). 
    success(function (data) { 
     $scope.greeting = data; 
    }); 
});

Quelle

2016-03-31 ChaseHardin

die ng-repeat entfernen. Die Ergebnisse sind nicht in einem Array.

Quelle

2016-03-31 01:30:53 Michael

Dank @Michael, das hat den Trick ... Ich werde dies als die Antwort markieren. Eine letzte Frage, würde dies genauso funktionieren, wenn mehrere Reihen von JSON-Daten zurückgegeben worden wären oder würde ich eine "ng-Wiederholung" benötigen? – ChaseHardin

Ja, wenn die Daten in einem Array wären, hätte die ng-Wiederholung perfekt funktioniert. Sie können dies im Codepen testen, ich habe es gegabelt und die Ergebnisse zu einem Array gemacht ... http://codepen.io/mkl/pen/vGJvLv – Michael

Ehrfürchtig, danke! – ChaseHardin

Hier gehen Sie;

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

myApp.controller("GreetingController", function ($scope, $http) { 
    $http.get('http://rest-service.guides.spring.io/greeting').then(function (data) { 
     $scope.greetings = data; 
     console.log(data); 
    }); 
});

Quelle

2016-03-31 01:32:07

RESTful Web Service mit AngularJS konsumieren

Antwort

Verwandte Themen