Problems with displaying data in the view (angularjs)

Question

This is a json sample with 2 objects im retrieving:

 [{"project_id":"538","proyecto":"Caja","tarea":"DEF","fecha_termino":"00-00-00","estado":"Vencido","nombre_completo":"Christiano Ronaldo","alerta":"-Analista responsable: Lionel Messi.; \r\n-Estado Actual: DEF en Construcci\u00f3n detenido por el arbitro.; \r\n-Evaluaci\u00f3n validar en caja lejos. Validacion de pin de trajetas cau.;\r\n28-06-2017 : Usuario Suspende proyecto por cambio de prioridad."},{"project_id":"538","proyecto":"Caja ","tarea":"CAT y Capacity","fecha_termino":"00-00-00","estado":"Vencido","nombre_completo":"Christiano Ronalddo","alerta":"-Analista responsable: Lionel Messi.; \r\n-Estado Actual: DEF en Construcci\u00f3n detenido por capacity de Depto de Tarjetas.; \r\n-Evaluaci\u00f3n validar en caja atalla o redbanc. Validacion de pin de trajetas cau.;\r\n28-06-2017 : Usuario Suspende proyecto por cambio de prioridad."}]

I storage the data in angular to be displayed:

scope.llamada1 = function() { 

    $http.get("conector.php?tipoDato=query1")
    .then(function(response) {
        $scope.mensajeEspera = "";
        $scope.datos1 = response.data;

        for(var i = 0; i < $scope.datos1.length; i++){
            var currentObj = $scope.datos1[i];
            currentObj.TareasObj = currentObj.tarea + ", " + currentObj.fecha_termino + ", " + currentObj.estado + ", " + currentObj.nombre_completo;
            console.log(currentObj.TareasObj);
            $scope.detalleProyecto = currentObj.TareasObj;
            currentObj.detalleProyecto = currentObj.TareasObj;
        }
    $scope.detalleProyecto = currentObj.TareasObj;
    });
}

I have Projects, and each project can have multiple tasks, I need to display the data like this:

<table id="tablaTareas" class="table table-striped table-bordered" >
    <thead>
        <tr>
        <td><b>Proyecto</b></td>
        <td><b>Alerta</b></td>
        <td><b>Tareas</b></td>
        </tr>
    </thead>
    <tbody>
        <tr ng-repeat="x in datos1 ">
            <td style="vertical-align: top;">{{x.proyecto}}</td>
            <td style="vertical-align: top;">{{x.alerta}}</td>
            <td style="vertical-align: top;">
            <table class="table table-striped table-bordered" >
                <thead>
                    <tr>
                        <td><b>Tarea</b></td>
                        <td><b>Termino</b></td>
                        <td><b>Estado</b></td>
                        <td><b>Responsable</b></td>
                    </tr>
                </thead>

                <tbody>
                    <tr ng-repeat="y in x.detalleProyecto track by $index">
                        <td style="vertical-align: top;">{{y.tarea}}</td>
                        <td style="vertical-align: top;">{{y.fecha_termino}}</td>
                        <td style="vertical-align: top;">{{y.estado}}</td>
                        <td style="vertical-align: top;">{{y.nombre_completo}}</td>
                    </tr>
                </tbody>
            </table>

            </td>
        </tr>
    </tbody>
</table>

I dont know what is the problem with the code, i think i may be retrieving the data in angulajs in the wrong way?

I dont know what is the problem with the code: If you can't tell what the problem is, how could we help fixing it? Tell what you expect your code to do, and tell what it does instead. The code in the then() callback function doesn't make much sense. You should rethink about it. — JB Nizet
– JB Nizet, Commented Feb 22, 2017 at 17:37
Try to debug your code. May be put console.log (response.data) inside http.get.then () to see if there is data. if there is, then see if the datos1 has the value. and slowly you will reach a point where you will find the glitch. — Smit
– Smit, Commented Feb 22, 2017 at 17:40
@frager0 check the plnkr plnkr.co/edit/AmVEq3gJrSRxTZux0lWa?p=preview — Sachila Ranawaka
– Sachila Ranawaka, Commented Feb 22, 2017 at 17:46

shika_ · Accepted Answer · 2017-02-22 17:50:23Z

2

Looks like detalleProyecto of each datos1 needs tarea, fecha_termino, estado and nombre_completo which are missing. And I dont understand why you need "$scope.detalleProyecto"., so i m omitting that out.

the for should atleast be this for it to work!

for(var i = 0; i < $scope.datos1.length; i++){
    var currentObj = $scope.datos1[i];
    currentObj.TareasObj = {tarea : currentObj.tarea ,  fecha_termino: currentObj.fecha_termino, estado:currentObj.estado, nombre_completo: currentObj.nombre_completo};
    currentObj.detalleProyecto = currentObj.TareasObj;
}

answered Feb 22, 2017 at 17:50

shika_

212 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Pawan Gupta Over a year ago

I think you will have to push currentObj.TareasObj into currentObj.detalleProyecto aarray. currentObj.detalleProyecto.push(currentObj.TareasObj);

frager0 Over a year ago

thanks! im able to storage the data of the values i mentioned now in TareasObj, but i still cant display them in the view >.<

shika_ Over a year ago

The currentObj doesn't have the keys 'TareasObj' or 'detalleProyecto'. Its not an array so I think it should be fine. It will just add new key-value pairs.

Icarus · Accepted Answer · 2017-02-22 19:13:40Z

0

for(var i = 0; i < $scope.datos1.length; i++){
    var currentObj = $scope.datos1[i];
    $scope.datos1[i].detalleProyecto = [{
        "tarea":currentObj.tarea , 
        "fecha_termino":currentObj.fecha_termino , 
        "estado":currentObj.estado, 
        "nombre_completo":currentObj.nombre_completo
    }];
}

edited Feb 22, 2017 at 19:13

Icarus

1,6577 gold badges20 silver badges34 bronze badges

answered Feb 22, 2017 at 18:29

Krushn Vaghasiya

161 bronze badge

Collectives™ on Stack Overflow

Problems with displaying data in the view (angularjs)

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related