como parsear datos angularjs

Question

resulta que hago esta peticion en el controllers a mi php:

  $http({
  method: 'POST',
  url: 'http://localhost/nPanelarencion/app/php/consulta.php',
  headers: {
      'Content-Type': 'application/json', 
      'Accept': 'application/json' 
  },

})

la cual en consola me muestra sus datos de la siguiente manera

Esos mismos datos necesito guardarlos en $scope para poder usarlos en html...

Controller code:

 app.controller('search', function($timeout, $scope, $http) {

//     comienza la  conexion

getInfo();

function getInfo(){

  $http({
      method: 'POST',
      url: 'http://localhost/nPanelarencion/app/php/consulta.php',
      headers: {
          'Content-Type': 'application/json', /*or whatever type is relevant */
          'Accept': 'application/json' /* ditto */
      },
      data: {
       /* You probably need to send some data if you plan to log in */
   }
  })

.success(function(data){

    console.log(data);
    localStorage.setItem("Tickets", angular.fromJson(data));


//NEXT>

       $scope.loadUsers = function() {
         return $timeout(function() {
           $scope.tickets = localStorage.getItem('Tickets');

         }, 650);
       };
})};

conection.php:

<?php
// Connecting to database as mysqli_connect("hostname", "username", "password", "database name");
$con = mysqli_connect("localhost", "root", "", "saltala");
?>

consulta.php:

<?php

// Including database connections
require_once 'conection.php';
// mysqli query to fetch all data from database
$query = "SELECT rut, numero, servicio_id FROM Tickets";
$result = mysqli_query($con, $query);
$arr = array();
if(mysqli_num_rows($result) != 0) {

while($row = mysqli_fetch_assoc($result)) {
$arr[] = $row;
 }
}
// Return json array containing data from the databasecon
echo $json_info = json_encode($arr);
?>

PREGUNTO: ¿Como lo hago? he intentado parsearlo y todo pero aún no me sale.

necesito mostrar los rut en un select

      <md-select placeholder="Assign to user" ng-model="buscar" md-on-open="loadUsers()" style="min-width: 200px;">
    <md-option ng-value="user" ng-repeat="tick in tickets | filter : buscar" >{{tick.rut}}</md-option>
  </md-select>

¿Cuál es el error? ¿Te aparece algún error en la consola? ¿No se muestran los datos en la vista? — Edgar Ortega Ramírez, Oct 20 '16 at 19:37
ninguno, solo que no he podido mostrarlos, he intentado parsearlos de muchas maneras pero no he dado con ninguna. — Hernan Humaña, Oct 20 '16 at 19:40
Necesito mostrar los datos en el html, quiero mostrar todos los rut en un select... — Hernan Humaña, Oct 20 '16 at 19:43
Podrias poner el codigo javascript que usas para esto, quizas se el problema — Pedro Miguel Pimienta Morales, Oct 20 '16 at 19:50
Tienes el codigo PHP que hace ese JSON? quizas por ahi se esta haciendo dificil el tema — sioesi, Oct 20 '16 at 20:04
has tratado de hacer un `console.log()` apuntando a un objeto en especifico — Pedro Miguel Pimienta Morales, Oct 20 '16 at 20:23
si, me sale underfined intente con un console.log(response.data.rut); , console.log(JSON.stringfly(response.data.rut)); y lo mismo, con JSON.parse sale un error de posicion. — Hernan Humaña, Oct 20 '16 at 20:25
@HernanHumaña podrias imprimir el "data" que recibes cuando haces el post a tu archivo.php por favor.. es muy confuso el orden de tu array.. — sioesi, Oct 20 '16 at 20:26
No puedo copiarlo desde la imagen amigo! al menos enviame unos 2 o 3 datos de ese arreglo — sioesi, Oct 20 '16 at 20:27

devconcept · Accepted Answer · 2019-08-29T13:17:11.217

4

Tu problema no tiene que ver con AngularJS. Las funcioneslocalStorage.getItem y localStorage.setItem manipulan cadenas de caracteres

Un DOMString que contiene el valor de la clave. Si la clave no existe, devuelve null.

Lo que debes hacer es

$scope.loadUsers = function() {
     return $timeout(function() {

         $scope.tickets = JSON.parse(localStorage.getItem('Tickets'));
         ....

para convertir la cadena de nuevo a objeto y

.success(function(data){

    localStorage.setItem("Tickets", JSON.stringify(data));
    ......

al guardar dichos valores.

Lee ¿Cómo puedo convertir un string JSON a un objeto en JavaScript?

edited Aug 29 '19 at 13:17

answered Oct 20 '16 at 20:27

devconcept

12,541
3
39
56

lanza este error : angular.js:13920 ReferenceError: data is not defined – Hernan Humaña Oct 20 '16 at 20:33
Debes escribir eso en el success de tu llamada a tu archivo.php – sioesi Oct 20 '16 at 20:36
Tienes razón @sioesi. De hecho debería cambiar el `success` por `then` ya que este es obsoleto. – devconcept Oct 20 '16 at 20:41
Claro!, se ha visto harto que success ya esta obsoleto! @devconcept – sioesi Oct 20 '16 at 20:42
@devconcept puedes echar un ojo a mi respuesta? Creo que tambien es una opcion valida! tengo dudas sobre cuando recibo un JSON, volver a parsearlo – sioesi Oct 20 '16 at 20:50
1

@sioesi El objeto recibido en data puede renderizarse y recorrerse ya que es de hecho un objeto válido (siempre y cuando use `json_encode` en el servidor lo cual ya está haciendo) pero no hay necesidad de recorrerlo ya que esa tarea la hace automáticamente `ng-repeat` en la vista – devconcept Oct 20 '16 at 20:59

sioesi · Answer 2 · 2016-10-21T17:34:49.947

1

Solucione el problema anterior, ahora que tengo los datos, los quiero guardar en LocalStorage pero me sobreescríbe los datos, dejándome sólo uno...

Cómo guardo los datos? en el controlador, quedando así:

    $http({
    method: 'POST',
    url: 'http://localhost/nPanelarencion/app/php/consulta.php',
    headers: {
        'Content-Type': 'application/json',
        'Accept': 'application/json'
    }
})

  .then(function(data) {
     var dat = data.data;

     for (var i = 0; i < dat.length; i++) {
       dat[i]
      var runum = dat[i].rut +","+ dat[i].numero
      console.log("show: ",runum);
      localStorage.setItem("rutnum",runum);
     }
  });

y console.log(runum) ahora muestra esto:

Ahora, Como recibo los datos?, bueno en otro controlador, en la funcion siguiente:

      function loadAll() {
    var rut = localStorage.getItem("rutnum").split(",")[0];
    console.log("el rut es: ",JSON.stringify(rut));


    var num = localStorage.getItem("rutnum").split(",")[1];
    console.log("El numero es: ",parseInt(num));
    var finalnum = parseInt(num)

    var repos = [
      {
        'rut'      : rut,
        'numero'   : finalnum

      }

    ];
    return repos.map( function (repo) {
      repo.value = repo.rut.toLowerCase();
      return repo;
    });
  }

y como dije anteriormente el resultado es que solo me muestra un solo rut y un solo numero, entiendo que sobre escribe el anterior, como hago para guardar todos los rut?

Esta es la imagen del LocalStorage y lo que me muestra:

EDIT SIOESI

El error esta en la siguiente linea :

 for (var i = 0; i < dat.length; i++) {
      var runum = dat[i].rut +","+ dat[i].numero
      console.log("show: ",runum);
      localStorage.setItem("rutnum",runum);
 }

Tu estas recorriendo tu arreglo y guardando 1 por 1 EL MISMO NOMBRE DE LA KEY DE TU LOCALSTORAGE.. por eso siempre queda el ultimo Debes hacer algo asi

var tickets = [];
for (var i = 0; i < dat.length; i++) {
    var ticket = {id : dat[i].id, rut : dat[i].rut};
    tickets.push(ticket);
}
localStorage.setItem("Tickets",tickets);

Entonces, creas un tipo de objeto del arreglo que tiene id y rut, lo agregas en el arreglo tickets y luego guardar en localStorage el arreglo Tickets.. Ese arreglo tickets lo llamas desde tu controlador

$scope.tickets = localStorage.getItem('Tickets');

Y ahora puedes recorrerlos

<div ng-repeat="ticket in tickets">
    {{ticket.rut}}
</div>

edited Oct 21 '16 at 17:34

answered Oct 20 '16 at 20:48

sioesi

11,365
5
20
55

angular.js:13920 ReferenceError: i is not defined error – Hernan Humaña Oct 20 '16 at 21:02
@HernanHumaña i esta definido en el for, no deberia dar ese error. De todas formas, la mejor respuesta a tu caso es la de devconcept – sioesi Oct 20 '16 at 21:06
@HernanHumaña no entiendo tu problema ahora... – sioesi Oct 21 '16 at 16:08
@HernanHumaña voy editar ya encontre el error – sioesi Oct 21 '16 at 16:10
en LocalStorage me guarda solo un solo rut y no todos los rut... – Hernan Humaña Oct 21 '16 at 16:10
@HernanHumaña edite mi respuesta dice EDIT SIOESI, ahi te explico tu problema... – sioesi Oct 21 '16 at 16:14
me funciono pero lo tube que parsear ya que salía [obj][obj] – Hernan Humaña Oct 21 '16 at 18:45
[Continuemos el debate en el chat](http://chat.stackexchange.com/rooms/47195/discussion-between-sioesi-and-hernan-humana). – sioesi Oct 21 '16 at 18:56
Hernan eso iba a pasar porque yo hice un objeto con id y con rut, tu mostrabas un string con tu rut y concatenando el id. – sioesi Oct 21 '16 at 18:56
Ahora jaja estoy intentando implementarlo en un autocomplete de angularjs-material y me muestra solo 1 dato, de echo el mismo rut y numero que el del post una joda... jajaja – Hernan Humaña Oct 21 '16 at 19:04
Es que realmente tu no tienes claro que hacer, no cambias la pregunta y haces cambios sin avisar asi es imposible darte una respuesta concreta. Imposible. – sioesi Oct 21 '16 at 20:09
ire mejorando eso, sorry . y a tí te agradezco un monton – Hernan Humaña Oct 21 '16 at 20:34

como parsear datos angularjs

2 Answers2