How to dynamically generate form fields with angular?

Question

I have an array containing a list of my backend fields for some model

ie:

$scope.fields = ['username', 'password', 'email', ...];

How can I do the following with angular:

<div ng-repeat="field in fields">
   <div class="form-group">
        <label class="col-sm-2 control-label">{{field }} </label>
        <div class="col-sm-10">
              <input class="form-control" 
                     type="text" 
                     required
                     ng-model="new_entry.{{field}}"/>
        </div>
    </div>
</div>

Answer 1

You should be able to set the model like this:

ng-model="new_entry[field]"

Just as you can access any object property using [] syntax:

If you have

x = { name: 'Joe', age: 24 }

You can access a property by doing

x.name

Or by doing

x['name']

http://jsfiddle.net/WN2dc/1