I\'m trying to generate form inputs with ng-repeat. Note: \'customFields\' is an array of field names: [\"Age\", \"Weight\", \"Ethnicity\"].
Try this ng-model="person.customfields."{{field}} Moved the double quotes
<div ng-app ng-controller="Ctrl">
<div class="control-group" ng-repeat="field in customFields">
<label class="control-label">{{field}}</label>
<div class="controls">
<input type="text" ng-model="person.customfields[field]" />
</div>
</div>
<button ng-click="collectData()">Collect</button>
</div>
function Ctrl($scope) {
$scope.customFields = ["Age", "Weight", "Ethnicity"];
$scope.person = {
customfields: {
"Age": 0,
"Weight": 0,
"Ethnicity": 0
}
};
$scope.collectData = function () {
console.log($scope.person.customfields);
}
}
You can try it here.
Updated:
For the validation, the trick is to put <ng-form>
inside the repeater. Please try.
Any on who ends up here For ng-model
inside ng-repeat
http://jsfiddle.net/sirhc/z9cGm/
the above link has good description on how to use it with examples
It should be:
<input type="text" ng-model="person.customfields[field]" />