如何使用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]
}]

即使使用ng-repeat，我也找不到解决这个问题的好方法。 一旦表单具有大约30个字段以及15种以上不同的输入类型，它将变得非常难看。

什么是“ Angular”方法来执行此操作，还是应该在服务器上动态生成controller.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.
    }