AngularJS：动态表单生成

Question

我需要以更新它的属性的现有值或值添加到被多值属性生成基于文档结构动态形式的一种方式。

我有角，其接收文档类名称和ID并拉动该类的特定文档的控制器。

控制器读取文档并保存数据，如属性数量，属性类型，属性是否为多值以及值。

每个类的属性数量不同，属性类型不同。

这里是通过我的控制器为特定类的特定文档生成的数据的一个例子：根据经处理的类

CLASS/id {cid: "Disease/54d49a8c3b70f6cce63dc475"} 
N° ATTRIBUTES:3(without counting multivalues of the same attribute) 


///////////////////////////////////////////////////////////////////////////////////////////// 
ATTRIBUTE NAME:displayName 
///////////////////////////////////////////////////////////////////////////////////////////// 
ATTRIBUTE DATA TYPE:text 
MULTI VALUE ATTRIBUTE:0(not multivalue field) 
ATTRIBUTE N° OF VALUES:1(existing n° of values at the moment) 
ATRIBUTE ARRAY POSITION:0 ---> value displayName #1 


///////////////////////////////////////////////////////////////////////////////////////////// 
ATTRIBUTE NAME:identifier 
///////////////////////////////////////////////////////////////////////////////////////////// 
ATTRIBUTE DATA TYPE:text 
MULTI VALUE ATTRIBUTE:1(multivalue field) 
ATTRIBUTE N° OF VALUES:1(existing n° of values at the moment) 
ATRIBUTE ARRAY POSITION:0 ---> value identifier #1 


///////////////////////////////////////////////////////////////////////////////////////////// 
ATTRIBUTE NAME:r 
///////////////////////////////////////////////////////////////////////////////////////////// 
ATTRIBUTE DATA TYPE:date 
MULTI VALUE ATTRIBUTE:1(multivalue field) 
ATTRIBUTE N° OF VALUES:3(existing n° of values at the moment) 
ATRIBUTE ARRAY POSITIONS:0 ---> value r #1 
ATRIBUTE ARRAY POSITIONS:1 ---> value r #2 
ATRIBUTE ARRAY POSITIONS:2 ---> value r #3 

和记录这些值的变化。

这一切工作正常，但我新的角度和不知道如何根据前者产生的数据呈现在观察侧的东西。

基于以上我显示的数据例如希望产生的形式是这样的：

谁能帮我出我，这是正确的做法？

Answer 1

1）的文档数据转换为对象的JSON列表，每个对象是一个字段：

fields = [ 
{"name": "displayName", dataType: "text", isMultiValue: false, numberOfValues: 1}, 
... 
] 

这可能是最复杂的部分。

2）某处在控制器：

$scope.documentData = {}; 
$scope.getFieldTemplateUrl = function(field) { 
    return '/url/to/field/templates/' + field.dataType + '.html'; 
}; 

3）

<div ng-repeat="field in fields"> 
    <div ng-include="getFieldTemplateUrl(field)"></div> 
</div> 

4）定义为每个dataType那些字段模板。 “文本”这是相当简单：

<label for="{{field.name}}">{{field.name}}</label> 
<input id="{{field.name}}" type="text" ng-model="documentData[field.name]" /> 

大厦这一点，您需要添加支持isMultiValue和可能填充documentData与现有的数据。

也有很多图书馆做正是这一点：

• https://github.com/Textalk/angular-schema-form
• https://github.com/danhunsaker/angular-dynamic-forms