title: AngularJS Ui-grid DataTables, how to avoid multi ng-repeat
body: <p>Here is the problem,</p>
  
  <p>I made some kind of people listing with angularJS.
  People are JSON objects that look like this : </p>
  
  <pre><code>{ "id":"0" , "name":"My name" , "firstname":"My first Name" , "contacts":[{"id":"0" , "type":"phone" , "value":"0574869345"},{"id":"1" , "type":"email" , "myEmail@mail.com"}] }
  </code></pre>
  
  <p>Notice that the person may have several contact informations (emails, phones, etc...)</p>
  
  <p>I was actually able to display the people list (array) into a "simple" table with : </p>
  
  <ol>
  <li>ng-repeat on "persons" (people in peopleList)</li>
  <li>ng-repeat on "contacts" (contact in people.contacts)</li>
  </ol>
  
  <p>This sounds somehow like the most logical &amp; easy solution. BUT in some other cases, with less complex data, I am working with the "ng-grid", which is now "ui-grid" to display data-tables.</p>
  
  <p>And, before that, I used to work with jquery.dataTables but seems like it does not fit angular since it is directly related to a js var, and is not "updated" on $scope changes... As you probably got it, user will be able to "change" people list on event. So the grid / table contents have to be linked to the scope.</p>
  
  <p>Here is a very shortened/simplified example of the current "only angular" solution I am trying to achieve : <a href="http://jsfiddle.net/k2p3xxhx/" rel="nofollow noreferrer">http://jsfiddle.net/k2p3xxhx/</a></p>
  
  <p>Here is the ng-grid solution (<strong>not working</strong>!) which I'd like to use if possible : <a href="http://jsfiddle.net/guprs47p/" rel="nofollow noreferrer">http://jsfiddle.net/guprs47p/</a></p>