title: AngularJS - Building a dynamic table based on a json
body: <p>Given a json like this:</p>
  
  <pre><code>{
     "name": "john"
     "colours": [{"id": 1, "name": "green"},{"id": 2, "name": "blue"}]
  }
  </code></pre>
  
  <p>and two regular html inputs:</p>
  
  <pre><code>&lt;input type="text" name="name" /&gt;
  &lt;input type="text" name="color" /&gt;
  &lt;input type="submit" value="submit" /&gt;
  </code></pre>
  
  <p>I need to build a table with all the possible variations, ex:</p>
  
  <pre><code>John green
  John blue
  </code></pre>
  
  <p>That means that if a user continues adding values through the inputs new rows will appear building the new variations, for instance: </p>
  
  <p>I also need to have available the id to handle it, and I need that when I add new values using the inputs for instance: "Peter" "Black", I need to autofill the id (colour id) dynamically like an auto increment in mysql, resulting in something like this:</p>
  
  <pre><code>{
    "colours": […...{"id": 3, "name": "black"}]
  }
  </code></pre>
  
  <p>Is that possible? Which options do I have for doing that with angular? I'm still thinking in the jQuery way and I would like to do it in the angular way.</p>
  
  <p>I took a look to hg-repeat, and used it, but I'm not figuring out how to deliver the expected result, the only thing that come to my mind was to use nested ng-repeats, but it didm´t work.</p>
  
  <p>Thanks so much in advance,</p>
  
  <p>Guillermo</p>