title: AngularJS binding to nested model properties
body: <p>We've built a dynamic form directive that gets metadata from the server and then builds a form dynamically. The rendered inputs are bound to a <code>Model</code> object separate from the metadata. In order to achieve that, we are doing something like this:</p>
  
  <pre><code>&lt;input type="field.Type" 
         ng-model="Model[field.Name]" 
         ng-repeat="field in metadata.Fields" /&gt;
  </code></pre>
  
  <p>Assume that the above mark-up works (well, it does - in a simple scenario) and the binding works as expected. Unfortunately, it all breaks when the model we're using is not a collection of scalar properties. Examples include:</p>
  
  <ul>
  <li>Measure.Id</li>
  <li>Dimensions[0].SelectedAttribute</li>
  </ul>
  
  <p>As you can see, the problem occurs when I have a nested property and/or when I have a list that I need to bind to, which is obviously a normal behavior because we're using the <code>Model[propertyName]</code> notation to achieve the dynamic binding.</p>
  
  <p>I've thought about parsing the expression coming from the server myself and walk-down the hierarchy of the model (the nested properties) and figure out the binding, but I couldn't get it right (yet). Moreover, I still have nothing in mind of hour I'm going to solve the list/array binding issue.</p>
  
  <p>Any thoughts?</p>