Bill_Data23 Bill_Data23 - 1 year ago 154
Javascript Question

How to load data in ng table from REST web service that return a JSON

I want to load my table from a JSON that returns my REST web services in SpringMVC, but I get the following error that says that my rest method doesn't support the GET method.

The URL that my controller have mapped is this one


and the URL changes from that to this


I don't know why the URL changes to that since I'm doing just the basic example from the website

Here is the function in my controller that calls the webservices

var Api = $resource('http://localhost:8080/MyApp/doc/showDocTable/');
this.tableParams = new NgTableParams({}, {
getData: function (params) {
// ajax request to api
return Api.get(params.url()).$promise.then(function (data) {; // recal. page nav controls
return data.results;

And here is my controller method in Spring MVC

@RequestMapping(value = "/doc/showDocTable/", method = RequestMethod.GET)
public ResponseEntity<List<HistDoc>> showTable() {
List<HistDoc> listHistDoc = docDAO.getDocs();

return new ResponseEntity<List<HistDoc>>(listaHistDoc, HttpStatus.OK);

And here is the error that I get in my browser

GET XHR http://localhost:8080/MyApp/doc/showDocTable/?count=10&page=1 [HTTP/1.1 405 Request method &#39;GET&#39; not supported 6ms]

and here the error in my console

WARN 2016-08-11 12:46:58,206 [http-listener-1(4)] org.springframework.web.servlet.PageNotFound - Request method 'GET' not supported

I think the problem is that somehow ngTable changes the URL to that weird URL and my web method in Spring doesn't know what to do.

I removed the "/" from my backend method url like this `@RequestMapping(value = "/doc/showDocTable", method = RequestMethod.GET)
public ResponseEntity> showTable() {
List listHistDoc = docDAO.getDocs();

return new ResponseEntity<List<HistDoc>>(listaHistDoc, HttpStatus.OK);

and also I removed the "/" from the getData method in angularJs controller

var Api = $resource('http://localhost:8080/MyApp/doc/showDocTable');

But now I get this error in my browser firefox console

Error: $resource:badcfg
Response does not match configured parameter

Error in resource configuration for action `get`. Expected response to contain an object but got an array (Request: GET http://localhost:8080/MyApp/doc/showDocTable)

Here is my HTML

<div class="col-lg-12" ng-controller="EstHistDoc as demo">

<table ng-table="demo.tableParams" class="table table-bordered table-striped table-condensed">
<tr ng-repeat="row in $data track by row.idDoc">
<td data-title="'Name'" filter="{name: 'text'}" sortable="'name'">{{}}</td>
<td data-title="'Description'" filter="{description: 'text'}" sortable="'description'">{{row.description}}</td>

and here is the JSON that I return from the backend

"name":doc one,
"description:" "a description"
"name": doc two,
"description:" "a seconddescription"

Answer Source

You must use $resource.query() (Api.query()) instead of $resource.get() (Api.get()).

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download