Consume a Restful Service with Angularjs

Asked

Viewed 1,354 times

2

I did a project in eclipse with a service Rest in java, if I run directly in the browser my service it returns my data right:

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

Now I want to consume and show in a table with the angular js, so I tried so:

<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("Agenda") 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 doesn’t work, I debugged and didn’t get to enter the service, what can it be? remembering that everything is in the same project both the view and the backend.

1 answer

2


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;
    });
});

Browser other questions tagged

You are not signed in. Login or sign up in order to post.