My Play framework project utilizes AngularJS for its views. The controller responsible for fetching data sends 2 requests, each returning a JSON block. While the first request works fine and displays the data correctly, the second request's data gets distorted by Angular (as shown below).
The JSONs are generated accurately before rendering, as evidenced by the application log. Here is the correct JSON (extracted from the Play Framework routed method's log):
{"id":5,"name":"auditoria","url":null,"version":1,"methods":[]}
This is how AngularJS interprets it. It tokenizes :
[{},{"0":"a","1":"u","2":"d","3":"i","4":"t","5":"o","6":"r","7":"i","8":"a"},{},{},{"length":0}]
Below is the snippet of the controller:
app.controller("ViewCtrl", [ "$scope", "$resource", "$routeParams", "apiUrl",
function($scope, $resource, $routeParams, apiUrl) {
var ServiceList = $resource(apiUrl + "/services");
$scope.services = ServiceList.query(); //JSON is displayed properly
if ($routeParams.id) {
jsonServicoQuery = apiUrl + "/services/" + $routeParams.id
var Service = $resource(jsonServicoQuery);
$scope.currentService = Service.query(); //JSON is butchered
}
} ]);
Here's the HTML structure:
<div class="row">
<div class="col-md-3">
<div class="bs-sidebar hidden-print" role="complementary">
<ul class="nav bs-sidenav">
<li><a href="/create"><i class="fa fa-plus"></i></a></li>
<li ng-repeat="s in services| orderBy:'name'"><a
href="/view/{{s.id}}">{{s.nome}}</a>
<ul>
<li ng-repeat="m in s.methods| orderBy:'name'">{{m.name}}
[{{m.id}}]</li>
</ul></li>
</ul>
</div>
</div>
<div class="col-md-9" role="main">
<div class="bs-docs-section">
<div class="page-header">
<!-- displaying the whole currentService JSON for debugging purposes -->
{{currentService}}
</div>
</div>
</div>
</div>
Can anyone identify what I might be doing incorrectly?
Update: Service.query() triggers the method directed by Play Framework.
Route configuration:
GET /api/services/:id controllers.Services.show(id: String)
And the implementation of
controllers.Services.show(id: String)public static Result show(String id) {
Service s = Service.findById(id);
//The correct JSON is displayed here, see log below
Logger.info("At Services show, json " + Json.toJson(s));
return ok(Json.toJson(s));
}
Log:
[info] application - At Services show, json {"id":5,"name":"auditoria","url":null,"version":1,"methods":[]}