2

Boa tarde pessoal, Um coisa que deveria ser simples e não consigo. Estou consultando minha base de dados no firebase, onde tem 2 registros guardados. Faço a busca e aparecem retorna os dados no console, usando console.log(), PORÉM, não consigo exibir esse dados na tela, onde devem aparecer!!!

app.controller('ListagemCtrl', function($scope, $rootScope, $location, $firebaseObject){
$rootScope.activetab = $location.path();

$scope.filmesCadastrados = [];

firebase.database().ref('filmes/').once('value').then(function (snapshot) {
    for(var id in snapshot.val()){

        var filme = snapshot.val()[id];
        console.log(filme);

        $scope.filmesCadastrados.push(filme);
    }
});

});

E esse é meu HTML:

<div ng-controller="ListagemCtrl">
  <table class="table table-striped" >
    <tbody>
        <tr> 
            <th>Título do Filme</th>
            <th>Diretor</th>
            <th>Categoria</th>
            <th>Duração</th>
        </tr>
        <tr ng-repeat="filme in filmesCadastrados">
            <td>{{filme.titulo}}</td>
            <td>{{filme.diretor}}</td>
            <td>{{filme.categoria}}</td>
            <td>{{filme.duracao}}</td>
        </tr>
    </tbody>
    </table>
</div>

Isso é exibido no console: inserir a descrição da imagem aqui Onde estou errando?

8
  • Mostra o que tá no console.log por favor
    – Sorack
    24/11/2016 às 17:24
  • Mostra a saída desse seu console.log 24/11/2016 às 17:28
  • Acabei de postar o que o console exibe. 24/11/2016 às 17:29
  • Object {categoria: "FIC", diretor: "Jon Favreau", duracao: 130, titulo: "Homem de Ferro"}categoria: "FIC"diretor: "Jon Favreau"duracao: 130titulo: "Homem de Ferro"proto: Object controllerr.js:38 Object {categoria: "FIC", diretor: "George Lucas", duracao: 150, titulo: "Star Wars"} 24/11/2016 às 17:29
  • @GustavoSevero onde vc coloca a tag ng-app no seu HTML?
    – Sorack
    24/11/2016 às 17:33

2 Respostas 2

1

Faz isso:

$scope.filmesCadastrados.push({
    titulo: filme.titulo,
    diretor: filme.diretor,
    categoria: filme.categoria,
    duracao: filme.duracao
})
0
1

A atualização, disparada por uma promise do firebase, não está disparando o ciclo $digest do Angular. Utilize o serviço $timeout, que provê um wrapper que invoca o ciclo, para provocar o proecessamento por parte do Angular:

app.controller('ListagemCtrl', function($scope, $rootScope, $timeout, $location, $firebaseObject){
  $rootScope.activetab = $location.path();

  $scope.filmesCadastrados = [];

  firebase.database().ref('filmes/').once('value').then(function (snapshot) {

    $timeout(function(snapshot) {

      for(var id in snapshot.val()){

        var filme = snapshot.val()[id];
        console.log(filme);

        $scope.filmesCadastrados.push(filme);
      };

    }, 1);
  });
});
3
  • Obrigado pela dica OnoSendai, mas já consegui... Não sei como, mas consegui. Outra coisa, tentei usar seu código, ai acima, mas quando rodo, no console aparece " 'val' undefined " e aponta para a linha dor FOR. 30/11/2016 às 19:05
  • @GustavoSevero Fico feliz em saber que seu código está funcionando. Quando ao val(), vale verificar a sua implementação - eu apenas indiquei como funcionaria um isolamento no wrapper $timeout.
    – OnoSendai
    30/11/2016 às 19:10
  • Minha implementação é esta que está no post. snapshot.val() é a referencia do dado que está lá no firebase. Se colocar snapshop.val()[id], como mostra uma linha abaixo, pega o id desse dados lá no firebse 30/11/2016 às 19:14

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .