Browse JSON - AngularJS

Question

Browse JSON - AngularJS

Navigation

#1 by (3 votes)
#2 by (2 votes)

0

I have the following object:

{ 
"_id" : ObjectId("5a0ae1a032e3762988cddb11"), 
"numeroBo" : NumberInt(4), 
"relato" : "aaaa", 
"modus" : "bbb", 
"falhasApuradas" : "aaaa", 
"eventosDeRisco" : [

], 
"acoesCriminosas" : [

], 
"alertas" : [
    {
        "_id" : ObjectId("5a0ae1a032e3762988cddb13"), 
        "tipoAcao" : [
            {
                "ticked" : true, 
                "name" : "Furto com maçarico"
            }, 
            {
                "ticked" : true, 
                "name" : "Roubo com furadeira"
            }
        ]
    }
], 
"veiculos" : [

], 
"suspeitos" : [
    {
        "_id" : ObjectId("5a0ae1a032e3762988cddb12"), 
        "name" : [

        ]
    }
], 
"longitude" : "-52.02091813087464", 
"latitude" : "-27.224810663086224", 
"fonte" : [
    {
        "ticked" : true, 
        "name" : "Polícia Civil"
    }, 
    {
        "ticked" : true, 
        "name" : "Gerente"
    }
], 
"dataCadastro" : ISODate("2017-11-14T12:29:20.721+0000"), 
"__v" : NumberInt(0)
}

Json in the browser console:

I need to get the index data numeroBo and alertas > tipoAcao > name and display it in a table. I know I should use forEachs to access this data, however, I can not understand the logic for after picking, as shown in the table (ng-repeat inside a forEach?) I made this forEach structure, until I was able to access the data, but not the correct way.

   angular.forEach(vm.alertas, function(value, key){
      vm.numBo = value.numeroBo
      vm.alert = value.alertas
      angular.forEach(vm.alert, function(value, key){
        vm.acoes = value.tipoAcao
        angular.forEach(vm.acoes, function(value, key){ 
          vm.tipoAcao = value.name
        })
      })     

      vm.final = {
        bo: vm.numBo,
        acao: vm.tipoAcao
      }
      console.log(vm.final.bo, vm.final.acao)
  })

angularjs json array foreach

asked by anonymous 14.11.2017 / 13:44

2 answers

2

The answer from @Virgilio is correct, but if you want to have a table instead of ul li (Which I particularly think is the best option), follow my example to complement: >

var app = angular.module('app', []);

app.controller('MainCtrl', function($scope) {
  $scope.obj = {
    "_id": "5a0ae1a032e3762988cddb11",
    "numeroBo": 4,
    "relato": "aaaa",
    "modus": "bbb",
    "falhasApuradas": "aaaa",
    "eventosDeRisco": [

    ],
    "acoesCriminosas": [

    ],
    "alertas": [{
      "_id": "5a0ae1a032e3762988cddb13",
      "tipoAcao": [{
        "ticked": true,
        "name": "Furto com maçarico"
      }, {
        "ticked": true,
        "name": "Roubo com furadeira"
      }]
    }],
    "veiculos": [

    ],
    "suspeitos": [{
      "_id": "5a0ae1a032e3762988cddb12",
      "name": [

      ]
    }],
    "longitude": "-52.02091813087464",
    "latitude": "-27.224810663086224",
    "fonte": [{
      "ticked": true,
      "name": "Polícia Civil"
    }, {
      "ticked": true,
      "name": "Gerente"
    }],
    "dataCadastro": "2017-11-14T12:29:20.721+0000",
    "__v": 0
  }

  $scope.tipoacao = $scope.obj.alertas[0].tipoAcao
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><linkrel="stylesheet" href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'>

<div ng-app="app" ng-controller="MainCtrl">
  <table class="stripped table">
    <thead>
      <tr>
        <th>NumeroBo</th>
        <th>Name</th>
      </tr>
    </thead>
    <tbody>
      <tr ng-repeat="item in tipoacao">
        <td>{{obj.numeroBo}}</td>
        <td>{{item.name}}</td>
      </tr>
    </tbody>
  </table>
</div>

14.11.2017 / 14:37

How to return the sum of column business_value, month by month, based on column start_date? How to return an object using the object name as a function parameter?

score 3 · Accepted Answer

First of all, this return should be improved by removing ObjectId , ISODate and NumberInt and literally putting its values, so that ahead read the example below:

var app = angular.module('app', []);
app.controller('ctrl', function($scope) {
  $scope.json = {
    "_id": ("5a0ae1a032e3762988cddb11"),
    "numeroBo": (4),
    "relato": "aaaa",
    "modus": "bbb",
    "falhasApuradas": "aaaa",
    "eventosDeRisco": [

    ],
    "acoesCriminosas": [

    ],
    "alertas": [{
      "_id": ("5a0ae1a032e3762988cddb13"),
      "tipoAcao": [{
          "ticked": true,
          "name": "Furto com maçarico"
        },
        {
          "ticked": true,
          "name": "Roubo com furadeira"
        }
      ]
    }],
    "veiculos": [

    ],
    "suspeitos": [{
      "_id": ("5a0ae1a032e3762988cddb12"),
      "name": [

      ]
    }],
    "longitude": "-52.02091813087464",
    "latitude": "-27.224810663086224",
    "fonte": [{
        "ticked": true,
        "name": "Polícia Civil"
      },
      {
        "ticked": true,
        "name": "Gerente"
      }
    ],
    "dataCadastro": ("2017-11-14T12:29:20.721+0000"),
    "__v": (0)
  }

});

<link rel="stylesheet" href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><divng-app="app" ng-controller="ctrl">
  <table>
    <tr>
      <td>{{json.numeroBo}}<td>
    </tr>
    <tr ng-repeat="t in json.alertas">
      <td ng-repeat="item in t.tipoAcao">
        <ul>
          <li>{{item.name}}</li>
        </ul>
        <td>
    </tr>
  </table>
</div>