I have the following problem. I have controller in Grails, which returns list in Json format:
render([tweets: tweets.take(2).collect { tweet -> [id: tweet.id, content: tweet.tweetContent]}] as JSON)
This is my UrlMapping:
"/tweets/"(controller: "tweets", parseRequest: true) {
action = [GET: "list"]
So when I just open this url in any browser, I am getting list of elements in JSON format:
{"tweets":[{"id":375238019298914304,"content":"@RonNegrita @Paolah_96 jajajajajajajajaja pues ale Negrita q nos lo has xk este del Tuit prima JAJAJAHAHAHAHA"},{"id":375238020360048640,"content":"My 38 Life Goals for next 10 years. Brewery's, Alabama Football, Concerts, Companies, Kids, Fiji, & more: http://t.co/behxfnCo5t"}]}
Then I am trying to get this elements in HTML page using Angularjs. This is my simple code for html page:
<!doctype html>
<html lang="en" ng-app id="ng-app">
<head>
<title>Page Title</title>
<script src="js/angular.js"></script>
<script>
function PostsCtrlAjax($scope, $http)
{
$scope.tweets = []
$http.get('http://localhost:8080/trutto-api/tweets/').success(function(data)
{
$scope.tweets = data; // response data
});
}
</script>
</head>
<body>
<div id="ng-app" ng-app ng-controller="PostsCtrlAjax">
<li ng-repeat="tweet in tweets>{{tweet.id}} - {{tweet.content}}</li>
</h2>
</div>
</body>
</html>
When I am trying to get data in Chrome browser, I am getting to following error:
"Xml http request cannot load http://localhost:8080/trutto-api/tweets/. Original null is not allowed by access-control-allow-origin"
I found question regarding this error here, it suggests starting Chrome with this command:
"- allow-file-access-from-files".
I tried it - it doens't work, returns the same error. Then I tried it on Glassfish server -> opening in Chrome leads to same error.
Opening in Mozilla Firefox leads to the following error:
SyntaxError: JSON.parse: unexpected end of data.
How should I fix it? Thank you in advance.
$scope.tweets = data.tweets;in the success callback? – dmahapatro Oct 23 '13 at 19:40