Consume a RESTful service with angular js

Question

Consume a RESTful service with angular js

Navigation

#1 by (2 votes)

2

I've done a project in eclipse with a service rest in java, if I run it directly in the browser my service it returns me my right data:

http://localhost:8080/Agenda/rest/Agenda/getLista

Now I want to consume and display in a table with angular js, so I tried like this:

<html>
<head>
<title>Aplicação</title>
<script src="angular.js"></script>
<script src="angular.min.js"></script>

<html>
<head>
<title>Hello World</title>
<script src="angular.js"></script>
<!-- <script src="angular.min.js"></script> -->

</head>
<body ng-app="myapp" ng-controller="agendaController">

<table  cellpadding="2" cellspacing="2" border="1">
    <tr>
        <th>Código</th>
        <th>Descrição</th>
        <th>Contato</th>
    <tr>
    <tr ng-repeat="agenda in listaAgenda">
        <td> {{agenda.codigo}} </td>
        <td> {{agenda.descricao}} </td>
        <td> {{agenda.contato.nome}} </td>
    </tr>
</table>
<script type="text/javascript">
    //      var myapp = angular.module('myapp', []);
    //      myapp.controller('agendaController', function($scope, $http) {
    //          $http.get('http://localhost:8080/Agenda/rest/Agenda/getLista')
    //                  .sucess(function(response) {
    //                      $scope.listaAgenda = response;
    //                  });
    //      });

    /* Service App */
    var myapp = angular.module('myapp', []);

    /* Service Comum */
    myapp.factory("$comum", function($http, $q) {
        function ajax(url, parametros, metodo) {
            var requisicao = $http({
                method : metodo,
                url : url,
                data : parametros
            });

            var promessa = requisicao.then(function(resposta) {
                return (resposta.data);
            }, function(resposta) {
                return ($q.reject("Something went wrong"));
            });
            return promessa;
        }
        return ({
            ajax : ajax
        });
    });


    /* Service Agenda */
    myapp.factory("$agenda", function($comum) {
        return {
            buscar : function(filtro) {
                var promessa = $comum.ajax("/Agenda/rest/Agenda/getLista", "", "GET");
                return promessa;
            }
        };
    });

    /* Controller */
    myapp.controller('agendaController', function($scope, $agenda) {
        $agenda.buscar().then(function(req) {
            $scope.listaAgenda = req;
        });
    });

</script>

Java:

@Path ("Calendar") public class AgendaWs {

@GET
@Path("getLista")
@Produces(javax.ws.rs.core.MediaType.APPLICATION_JSON)
public List<Agenda> getLista()
{
    List<Agenda> lista = new ArrayList();
    //declara objeto agenda
    Agenda agenda = new Agenda();
    Contato contato = new Contato();
    for(int i = 1; i<=10; i++)
    {


        agenda.setCodigo(i);
        agenda.setDescricao("Agenda para contato tal ***");
        //seta o contato
        contato.setCodigo(i);
        contato.setNome("telefone xxx- 1000 - 1000");
        agenda.setContato(contato);
        lista.add(agenda);
    }


    return lista;
}

ApplicationConfig.java

@javax.ws.rs.ApplicationPath("rest")
public class ApplicationConfig extends   javax.ws.rs.core.Application {

@Override 
public Set<Class<?>> getClasses()
{
    Set<Class<?>> resources = new  java.util.HashSet<>();
    addRestResourceClasses(resources);
    return resources;
}

private void addRestResourceClasses(Set<Class<?>> resources)
{
    resources.add(Transacao.AgendaWs.class);
}

}

But it does not work, I've debugged and never got into the service, what can it be? remembering that everything is in the same project both the view and the backend.

rest java angularjs

asked by anonymous 27.09.2015 / 15:57

1 answer

Algorithms and programming [closed] How to configure Log4j to generate a file in the WEB-INF folder with different date?

score 2 · Accepted Answer

Try the following:

/* Service App */
var myapp = angular.module('myapp', []);

/* Service Comum */
myapp.factory("$comum", function($http, $q) {
    function ajax(url, parametros, metodo) {
        var requisicao = $http({
            method: metodo,
            url: url,
            data:parametros
        });

        var promessa = requisicao.then(
            function(resposta) {
                console.log("Retorno: " + resposta);
                return(resposta.data);
            },
            function(resposta) {
                console.log("Erro ao executar: " + resposta);
                return($q.reject("Something went wrong"));
            }
        );
        return promessa;
    }
    return({
        ajax:ajax
    });
});

/* Service Agenda */
myapp.factory("$agenda", function($comum) {
    return {
        buscar : function(filtro) {
            var promessa = $comum.ajax("/Agenda/rest/Agenda/getLista", "", "GET");
            return promessa;
        }
    };
});

/* Controller */
myapp.controller('agendaController', function($scope, $agenda) {
    $agenda.buscar().then(function(req) {
        $scope.listaAgenda = req;
    });
});