How to use ng-repeat in a list of an object?

Question

How to use ng-repeat in a list of an object?

Navigation

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

1

How do I use ng-repeat in the object's Regions attribute?

Example: ng-repeat="item in objeto.RegioesFilhas

Object:

   var objeto = {
       "DescricaoRegiaoVaga": "",
       "IdCidadeCorreios": "1",
       "RegioesFilhas": [{
           "Cidade": "Brasília",
           "UF": "DF",
           "ID": "1"
       }, {
           "Cidade": "Asa Sul",
           "UF": "DF",
           "ID": "2"
       }],
       "Cidade": {
           "UF": "DF",
           "Cidade": "Brasília"
       }
   }

javascript angularjs angularjs-scope

asked by anonymous 28.12.2015 / 20:00

3 answers

1

Hello, try to set to $scope.objeto or instead of var = objeto . It was cute here

28.12.2015 / 20:17

0

This example demonstrates exactly its purpose: link

Just add the variable to the scope.

28.12.2015 / 20:29

How to correct these styles to get around the reported error? Clicking elements below a div?

score 4 · Accepted Answer

You can do it this way:

Instead of using var objeto change to $scope.objeto because that way you will bind Html to ng-repeat .

Then just do binding with the data in the component you want, in that case I used a list.

Recommended reading:

link

Example:

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

function MyCtrl($scope) {

$scope.objetos = {
       "DescricaoRegiaoVaga": "",
       "IdCidadeCorreios": "1",
       "RegioesFilhas": [{
           "Cidade": "Brasília",
           "UF": "DF",
           "ID": "1"
       }, {
           "Cidade": "Asa Sul",
           "UF": "DF",
           "ID": "2"
       }],
       "Cidade": {
           "UF": "DF",
           "Cidade": "Brasília"
       }
   }

}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><divng-app="myApp" ng-controller="MyCtrl">
 <ul ng-repeat="objeto in objetos.RegioesFilhas">
  <li>{{objeto.Cidade}}</li>
  <li>{{objeto.UF}}</li>
  <li>{{objeto.ID}}</li>
</ul> 
</div>