kozureookami
kozureookami

Reputation: 151

Loop within a loop in Angular

I have a json that looks like this:

var json = {
brands: [{
    name: "sony",
    count: "3"
}, {
    name: "canon",
    count: "5"
}],
countries: [{
    name: "France",
    count: "1"
}, {
    name: "Spain",
    count: "7"
}]
};

I'm trying to display this as facets with Angular

Brands
sony(3)
canon(5)

Countries
France(1)
Spain(7)

I could easily hardcode Brands and Countries and do something like

<div>
  Brands
  <p ng-repeat="brand in json.brands>{{brand.name}}({{brand.count}})</p>
</div>
<div>
  Countries
  <p ng-repeat="country in json.countries>{{country.name}}({{country.count}})</p>
</div>

BUT I'd rather do this without hard-coding and read "Brands" and "Countries" dynamically, basically having a loop in a loop.

Is that even feasible?

tnx!

Upvotes: 0

Views: 180

Answers (1)

jood
jood

Reputation: 2397

You can iterate throught key & values of an angular object:

<div ng-repeat="(key, value) in json">
  {{key}} 
  <p ng-repeat="brand in value>
      {{brand.name}}({{brand.count}})
  </p>
</div>

How can I iterate over the keys, value in ng-repeat in angular

Upvotes: 3

Related Questions