-1

Estou finalizando um app de mensagens, porém, não estou conseguindo fazer as mensagens aparecerem na tela.

HTML:

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

controller:

.controller('logradouroCtrl', function ($scope, $http, $window, $stateParams, $ionicScrollDelegate, socket) {

$scope.mensagem = {
    msg:""
  };

var pegaMsgsLogra = function () {

    idCep = $window.localStorage.getItem('idCep');
    idUsuario = $window.localStorage.getItem('idUsuario');
    var nome = $window.localStorage.getItem('nome');
    var usuario = $window.localStorage.getItem('usuario');
    var uf = $window.localStorage.getItem('uf');
    var cidade = $window.localStorage.getItem('cidade');
    var bairro = $window.localStorage.getItem('bairro');
    var logradouro = $window.localStorage.getItem('logradouro');


    socket.message(function(res){
        console.log(res);
        $scope.mensagens.push(res);
    })

        $ionicScrollDelegate.resize();
        $ionicScrollDelegate.scrollBottom(true);
}

services.js:

.factory('socket', function ($rootScope) {
    var wsUri = "ws://localhost:1234";//ocalhost:1234
    var socket = new WebSocket(wsUri);
    return {
        send: function (data) {
            socket.send(JSON.stringify(data));
        },
        message: function(callback){
            socket.onmessage = function(ev) {
                var result = JSON.parse(ev.data); //PHP sends Json data
                console.log(result);
                callback(result);
                //ev.data são os dados da mensagem que irão aparece na tela
                $rootScope.$apply(function () {
                    **$rootScope.mensagens.push(result);**
                });

            };
        }
    };
});

app.js:

.factory('socket', function ($rootScope) {
    var wsUri = "ws://localhost:1234";
    var socket = new WebSocket(wsUri);
    return {
        send: function (data, callback) {
            socket.send(JSON.stringify(data));
            var args = arguments;
        },
        message: function(){
            socket.onmessage = function(ev) {
                var result = JSON.parse(ev.data); //PHP sends Json data
                $rootScope.$apply(function () {
                    $rootScope.mensagens.push(result);

                });

            };
        }
    };
});

As mensagens aparecem dessa forma na tela:

Cannot read property 'push' of undefined

e aponta para essa linha do controller: $scope.mensagens.push(res);

1
  • Por favor evitem longas discussões nos comentários; a conversa de vocês foi movida para o chat
    – Maniero
    Commented 24/02/2017 às 18:45

1 Resposta 1

0

Gustavo o que pude perceber inicialmente, não estou avaliando para que esta utilizando e nem como esta utilizando a arquitetura angular, estou avaliando a logica do $scope.mensagem inicialmente, para exemplificar melhor fiz um JSBIN/qodajoc:

//IMagine que isto é como funciona a estrutura de objetos do angular em nivel $scope ou $rootScope o que diferencia um do outro é o grau de profundidade de e exposição entre os modulos.

var $scope = { 
   mensagem:{
     msg: "legal"
   } 
};

console.log($scope.mensagem.msg);
console.log(typeof($scope.mensagem));
// $scope.mensagem.push("asd");
// isto não é possivel ("TypeError: $scope.mensagem.push is not a function")  pois seu $scope.mensagem é um objeto. Para poder fazer o ajuste devido ele deveria ser uma estrutura de array para efetuar push. 

// Veja agora


var $scope = { 
   mensagem:[
     {
       msg: "legal"
     }
   ]
};

console.log(typeof($scope.mensagem));

$scope.mensagem.push({
 msg: "asd" 
});

console.log($scope.mensagem);

Aproveitando o gancho, caso queira manter utilizando um objeto ao invés de array o $scope.mensagem, recomendaria a utilização de KEY/iTEM:

$scope.mensagem = {

    0:{
       msg: "lero lero",
       status: "warning"
    },
    41:{
       msg: "lero lero",
       status: "warning"
    }


}

Assim caso precise verificar/atualizar ou etc um objeto basta buscalo pela KEY

$scope.mensagem[41].msg = "";
2
  • Opa, analisarei melhor o que respondeste. Valeu. Commented 19/07/2016 às 1:07
  • Entendi o que você quis dizer e mostrar. Mas já resolvi o meu problema. Obrigado. Commented 19/07/2016 às 1:49

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 .