Check out the JSFiddle link here: http://jsfiddle.net/vorburger/hyCTA/3/. It showcases an innovative "UI modeling" concept I came up with using AngularJS. The form is not directly coded in the HTML template; instead, it's controlled by uimodel JSON which defines how the datamodel should be displayed and edited:
<div ng-repeat="auimodel in uimodel">
<label>{{$index + 1}}. {{auimodel.label}}</label>
<input ng-model="datamodel[auimodel.model]" type="{{auimodel.type}}" />
</div>
The issue arises when the 'model' becomes more complex than a simple property and includes a 'path'. This breaks my square bracket dynamic keys approach, as shown in the faulty JSFiddle link: http://jsfiddle.net/vorburger/8CxRC/1/. Do you have any suggestions on how to handle this scenario?
Alternatively, would implementing a custom directive be the only solution for such cases? I prefer to avoid that route in order to maintain simplicity in creating and managing these UI model "meta templates."