AngularJS ng-model form driven by ng-repeat over UI model description data how to?

Question

The JSFiddle http://jsfiddle.net/vorburger/hyCTA/3/ illustrates a (working) \"UI modeling\" idea I had with AngularJS; note the form is not actually coded out in the HTML te

Answer 1

I've just figured out one (but may be not the best?) way to achieve this myself.. see http://jsfiddle.net/vorburger/8CxRC/3/ - basically still based on my square bracket dynamic keys 'trick', but with some pre-processing:

   for (var i = 0; i < $scope.uimodel.length; i++) {
        var resolvedModelProperty = $scope.datamodel;
        var remainingPath = $scope.uimodel[i].model;
        while (remainingPath.indexOf('.') > -1) {
            var nextPathSlice = remainingPath.substr(0, remainingPath.indexOf('.'));
            resolvedModelProperty = resolvedModelProperty[nextPathSlice];
            remainingPath = remainingPath.substr(remainingPath.indexOf('.') + 1);
        }
        $scope.uimodel[i].modelB = resolvedModelProperty;
        $scope.uimodel[i].modelL = remainingPath;
    }

Answer 2

You are along the same lines as my own project Metawidget. Metawidget's equivalent to what you are after is covered by metawidget.angular.widgetprocessor.AngularWidgetProcessor:

https://github.com/metawidget/metawidget/blob/master/modules/js/angularjs/src/main/webapp/lib/metawidget/angular/metawidget-angular.js

Although I didn't find the need to use the square bracket notation (I just did foo.bar.baz). Also the magic line:

$compile( widget )( scope.$parent );

Which turns the raw HTML you instantiate dynamically into fully-functioning Angular code.

If you get chance to take a look at Metawidget, I'd appreciate your feedback! Tutorial starts here.