0

Tenho um app de chat e o problema que estou tendo é o seguinte: Ao enviar uma mensagem, ela demorando um certo tempinho pra ser enviada e aparecer na tela, pois ela vai pra um banco de dados, via backend em php que eu fiz, e depois volta por um outro php que busca a mensagem e exibe na tela. Então uma solução que pensei, pra quebrar o galho, foi a seguinte, exibir as minhas mensagens, direto na tela, como nesse exemplo e só depois envio pro backend.. Já tenho uma tela que exibe as mensagens vindas do banco de dados, mas como fazer para exibir, nessa mesma tela, as mensagens que eu envio?

Minha view:

<div class="card" ng-repeat="mensagem in mensagens">
   <div class="item item-text-wrap">
     <h2>{{mensagem.usuario}}</h2>
     <p> {{mensagem.msg}}</p>
     <p>{{mensagem.hora}}</p>
   </div>
</div>

Controller:

$scope.enviarMsgChat = function (mensagem) {
    //console.log(mensagem);
    $scope.disableButtonChat = true;

    var dia = moment().format(); //2016-02-16 T 16:05:52-02:00
    var diaP = dia.split('T');
    var dia = diaP[0];

    var horaP = diaP[1];
    var horaP2 = horaP.split(':');
    var hora = horaP2[0]+':'+horaP2[1];

    var idUsuario = $window.localStorage.getItem('idUsuario');
    var nome = $window.localStorage.getItem('nome');
    var usuario = $window.localStorage.getItem('usuario');
    var msgChat = {
        idUsuario: idUsuario,
        nome: nome,
        usuario: usuario,
        mensagem: mensagem,
        dia: dia,
        hora: hora
    }

    $http.post("http://www.vigilantescomunitarios.com/www/php/enviaMsgChat.php", msgChat).then(function (data) {
        //console.log(data);
        $scope.disableButtonChat = false;
        pegaMsgsChat();
        $scope.mensagem = {
          chat: ""
        }

    })
}
6
  • A função pegaMsgsChat() traz todas as mensagem do chat, ou somente a ultima? Commented 16/05/2016 às 22:58
  • Ambas... Todas e a última. Commented 17/05/2016 às 12:17
  • Já pensou em colocar a mensagem nova direto no seu array mensagem ? O array que está no loop é o mensagem, então o que vc deveria fazer é por a sua mensagem também no array. Commented 17/05/2016 às 13:12
  • Pois é @AndréVicente, mas to apanhando pra fazer isso. Commented 18/05/2016 às 20:52
  • Tipo $scope.mensagens.push(msgChat). Coloca a parte do código onde vc seta o array de mensagens. Se ela for global vc consegue usar na função que recebe os valores e depois usa para adicionar a nova mensagem nela. Commented 18/05/2016 às 21:09

1 Resposta 1

0

Pega a ultima mensagem e adiciona no final do seu vetor de mensagens do angular.

Assim:

$scope.enviarMsgChat = function (mensagem) {
    var idUsuario = $window.localStorage.getItem('idUsuario');
    var nome = $window.localStorage.getItem('nome');
    var usuario = $window.localStorage.getItem('usuario');        
    var idChat = 0;
    var dia = moment().format(); //2016-02-16 T 16:05:52-02:00
    var diaP = dia.split('T');
    var dia = diaP[0];

    var horaP = diaP[1];
    var horaP2 = horaP.split(':');
    var hora = horaP2[0]+':'+horaP2[1];

    var msgChat = {
        idChat: idChat,
        idUsuario: idUsuario,
        nome: nome,
        usuario: usuario,
        msg: mensagem,
        data: dia,
        hora: hora
    }

    $scope.mensagens.push(msgChat);

    $http.post("http://www.vigilantescomunitarios.com/www/php/enviaMsgChat.php", msgChat).then(function (data) {
    //console.log(data);
        $scope.disableButtonChat = false;
        pegaMsgsChat();
        $scope.mensagem = {
           chat: ""
        }

    })
}

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 .