Как динамически создавать форму с помощью angularjs

Question

Я пытаюсь выяснить, как динамически создавать форму на основе массива полей, возвращаемых с сервера.

Что-то вроде этого

[{ 
    id: "title", 
    type: "text", /* Map to Input type=text */ 
    regex: "/^[a-zA-Z]+/" 
},{ 
    id: "summary", 
    type: "memo", /* Map to Textarea */ 
    regex: "/^[a-zA-Z]+/" 
},{ 
    id: "priority", 
    type: "list", /* Map to Select */ 
    options: [1,2,3,4,5] 
}] 

Я не могу понять, хороший способ сделать это, даже с нг-повтора. Как только форма имеет около 30 полей и 15+ разных типов ввода, она становится очень уродливой.

Что такое «Угловой» способ сделать это, или я должен генерировать dynamic.js и template.html динамически на сервере?

Answer 1

Попробуйте это. Это не ответ, просто подход. Надеюсь, это может помочь вам.

HTML:

<div ng-repeat="person in person"> 
<form class="form-group" name="signinForm"> 
<label>Name: 
<input class="form-control" ng-model="person.name" type="text"> 
</label> 
<label>Male: 
<input class="form-control" ng-model="person.gender" name="gender{{$index}}" type="radio" value="male"> 
</label> 
<label>Female: 
<input class="form-control" ng-model="person.gender" name="gender{{$index}}" type="radio" value="female"> 
</label><br> 
<label>Age 
<input class="form-control" ng-model="person.age" type="number"> 
</label> 
</form> 
<button type="button" ng-click="addPerson()">Add More</button> 
</div> 

JS:

$scope.initialize = [{}]; 
    $scope.person = {}; 
    $scope.addPerson = function(){ 
     $scope.initialize.push({});// adding more similar fields. 
    }