entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

Problemas al usar localStorage con AngularJS

Estoy haciendo pruebas con una aplicación web. Estoy usando localStorage para el almacenamiento de comentarios, pero no se está almacenando correctamente, ya que el mismo comentario es igual para todos los partidos, y quiero que cada partido tenga sus comentarios.

Si podéis echarle un vistazo tengo el repositorio subido en github:
https://github.com/danielreales7/Calendario-CDRota

Para ejecutarlo solo tenéis que poner en la terminal: grunt

Espero que podáis resolverme el error, llevo un tiempo atascado aquí.

Muchas gracias!

0voto

Peter comentado

¿Cual es el error?

0voto

danielreales7 comentado

Lo primero, es que en la vista de cada partido, donde aparece el botón de comentarios, cuando pinchas sobre él aparece un textarea con un placeholder: "Por favor díganos que piensa del partido de la jornada " y está vacío, debería de aparecer un número, ese creo que es el principal error, en la llamada del scope .

En la view de partidos.html llamo a dicha jornada así:

<partido-comments jornada="{{partido.jornada}}"></partido-comments>

Entonces desde el placeholder solo llamando a "jornada" me debería de aparecer, pero no aparece, entonces creo que está fallandome ahí al almacenar dicho comentario en el localStorage.

En el archivo services.js Están declarada las 2 funciones para obtener y guardar los datos en localStorage y en directives.js es donde está la directiva de dicho archivo que declaro el scope de la siguiente manera:

return {
            restrict: 'E', //Esta directiva quiere decir que estamos creando un elemento HTML
            templateUrl: 'partials/partido-comments.html',
            scope: {
                jornada: '@jornada'
            },
            link: function(scope, element, attributes){
                attributes.$observe('jornada', function(value){
                    if(value){
                        scope.jornada = value;
                        scope.comments = partidoService.getComments(value);
                    }
                });
            },
            controller: function($scope){
                $scope.comments = partidoService.getComments($scope.jornada); //Vamos a inicializar un arreglo donde vamos a ir guardando los comentarios
                $scope.comment = {}; //Aquí vamos almacenar los elementos del formulario
                $scope.show = false; //Con esto vamos a saber si nuestro panel se está mostrando o está oculto
                // Con esta función estamos cambiando de estado un valor Booleano
                $scope.toggle = function(){
                    $scope.show = !$scope.show;
                };

                $scope.anonymousChanged = function(){
                    if($scope.comment.anonymous){
                        $scope.comment.email = "";
                    }
                };

                $scope.addComment = function(){
                    $scope.comment.date = Date.now();
                    partidoService.saveComment($scope.jornada, $scope.comment);
                    $scope.comments = partidoService.getComments($scope.jornada);
                    $scope.comment = {};
                };
            }
        };

0voto

danielreales7 comentado

¿Alguien que pueda ayudar? Muchas gracias!

1 Respuesta

1voto

gcanedo Puntos630

Quita var localStorage = $window.localStorage;

usa directamente localStorage sin declarar.

0voto

danielreales7 comentado

No funciona, tengo realizado un ejemplo de igual forma que éste (el que hizo el maestro) y si funciona, en mi caso la "key" que se almacena en el localStorage está vacía y todos los demás datos se almacenan en JSON perfectamente, creo que ese es el error, pero no sé como solucionarlo.

0voto

gcanedo comentado

las key que usas siempre es la misma cadena, por eso son los comentarios son iguales:

scope: {
                    jornada: '@jornada'
            },

debes colocarle añadirle algo mas como un indice al final para las keys sean diferentes:
partidoService.saveComment($scope.jornada, $scope.comment);

Algo asi

scope: {
        jornada: '@jornada' + String(numeroJornada)
},

Si utilzas el Chrome, puedes acceder a las herramientas del desarrollador (o inspector de elementos dando clic derecho) y ver paso a paso en el localStorage los pares de key/item que vas almacenando.

0voto

danielreales7 comentado

Ese es el caso, que pensé que sucedía eso, pero no es así, yo accedo desde Chroome y la key está vacía, pero sin embargo el JSON del comentario si se ha almacenado.
Entonces se muestra en todos los partidos.
Y la jornada no es siempre la misma porque el archivo .json que contiene todos los partidos cada jornada es diferente, es lo que no entiendo.

Prueba a descargarte el repositorio y ejecútalo, verás que la key siempre está vacía cuando insertas un comentario, al igual que tampoco me coge la jornada el placeholder del textarea donde escribes el comentario.

Espero poder resolver esto, que seguramente será una tontería -.-.

Gracias!

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta