Problem loading data from a table with Angularjs and Rails api

Asked

Viewed 260 times

0

The code of my front-end :

var listaDeProdutos = function(){
    $http.get("http://localhost:3000/produtos").success(function(data,status){
        $scope.listaProdutos = data;
    }).error(function(data,status){
            console.log("error");
    });
};

<div class="table-responsive">
    <table class="table">
        <thead>
            <tr>
                <th>Data Vencimento</th>
                <th>Descrição</th>
                <th>Tipo Produto</th>
                <th>Preço</th>
                <th>Preço Desconto</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="produtos in listaProdutos">
                <td>{{ produtos.descricao}}</td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        </tbody>
    </table>
 </div>

Now my Back-End with Rails:

def index
  @produtos = Produto.all
  render json: @produtos
end

Result of JSON

{"produtos":[{"id":1,"descricao":"teste","tipoproduto":"Carnes","preco":12.0,"precodesconto":12.0,"datavencimento":"2015-09-17"},{"id":2,"descricao":"123","tipoproduto":"Carnes","preco":12.0,"precodesconto":12.0,"datavencimento":"2015-09-17"},{"id":3,"descricao":"teste","tipoproduto":"Carnes","preco":12.0,"precodesconto":12.0,"datavencimento":"2015-09-17"},{"id":4,"descricao":"testando salvar produto","tipoproduto":"Hortifruti","preco":20.0,"precodesconto":20.0,"datavencimento":"2015-09-18"}]}

I tested a Json manually by removing {"products": from my json returned by the api and it worked , how do I solve this problem?

1 answer

3


The object $scope.listaProdutos needs to refer directly to an array for ng-repeat to work.

Replacing the line

$scope.listaProdutos = data;

for

$scope.listaProdutos = data.produtos;

should solve the problem.

  • I’m just curious here. I wonder if he’d give a Json.Parse wouldn’t work?

  • I believe the object date in his success function already contains a perfect object. But, if a String comes, it must do JSON.parse, in addition to everything else. But still, the date by itself would not be an array. Actually, the date is an object that contains an array called products.

  • Vdd +1, good response.

  • Thanks for the return the problem solved :)

Browser other questions tagged

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