title: AngularJS ng-repeat for object contains objects and arrays
body: <p>I have an object, which has objects inside, and arrays in child objects. Here's the structure: </p>
  
  <pre><code>var keywords = {
      "Animals" : {
        "Pets" : [
          "Guppy", "Parrot", "Goldfish", "Dog", "Cat"
        ],
        "Wild animals" : [
          "Tiger", "Ant", "Tetra", "Peafowl", "Mongoose"
        ],
        "Domestic animals" : [
          "Cow", "Pig", "Goat", "Horse"
        ]
      },
      "Food" : {
        "Fast food" : [
          "Cheeseburger", "Hamburger"
        ],
        "Dessert" : [
          "Chocolate", "Cookie", "Cake", "Pie"
        ]
      },
      "Vehicle" : {
        "Motorcycle" : [
          "Harley Davidson"
        ],
        "Car" : [
          "Lamborghini", "Ferrari", "Bugatti", "BMW", "Mercedes"
        ]
      },
      "Movie" : {
        "Science fiction" : [
          "Sunshine", "Interstellar", "The Moon", "Oblivion", "Star Trek", "Star Wars"
        ]
      }
    };
  </code></pre>
  
  <p>I've made a foreach loop for looping through the elements inside and print them on screen: </p>
  
  <pre><code>  angular.forEach(keywords, function(value, key) {
      console.log(key);
  
      angular.forEach(value, function(value, key) {
        console.log(key);
  
        angular.forEach(value, function(value, key) {
          console.log(value);
        })
      })
    })
  </code></pre>
  
  <p>Now, I'm trying to do the same with ng-repeat directive on a div (that has a div in it, and another in the child div), but can't make it work, have no clue how to start it. Any idea?</p>