简体   繁体   中英

Referencing a dynamically created ng-model

I have a form which allows users to upload a json that fills this blank form with select/textbox inputs. Because these inputs are dynamically generated (as it's based on the json they upload), I need to be able to reference the answers they input (the ng-model).

So say the json looks like: var jsonObj=[ {"type": "select", "label": "Name", "values": ["a", "b", "c"], "default": "a"}, {"type": "select", "label": "Age", "values": [1, 2, 3]} ]

and I dynamically insert those inputs within a for loop via:

var newInputCol='<' + jsonObj[i].type + ' ng-model="' + jsonObj[j].label + '" class="form-control" ></' + jsonObj[j].type + '>';
var newInputRowElement = angular.element(newInputRow);
element.append(newInputRowElement);
$compile(newInputRowElement)($scope);

Also, I'm not using ng-repeat in the html as I'm trying to lay it out so there's a new row per 3 inputs in the json. But in order to do so, would I need to use ng-repeat? All the answers I've seen use ng-repeat and a empty object for referencing (like: How to generates dynamically ng-model="my_{{$index}}" with ng-repeat in AngularJS? )

What would I need to do to console.log all the ng-models after the user has filled out their self generated form after a button click (which can be done by placing a function in a button onclick or ng-click)?

I think I got it, a simple $scope[$scope.jsonObj[i].label] can reference it. Is there another way or should I stick with this?

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM