我正在尝试创建一个动态生成模式表单的模式。
我将只允许 3-4 种不同的类型(清单、字符串、图像、收音机)。
在单独的管理屏幕中,用户定义模板,我根据这些对象构建表单。
这是我到目前为止得到的,但没有生成任何表单。请记住,这是我第一次使用模式形式。
$scope.model = [];
$scope.schema = [];
$scope.form = [
];
function BuildDynamicForm(item){
$('#dynamicFormDiv').empty();
// go through each group and build a panel and list for each groups and fields
angular.forEach(item.FormGroups, function(value,key){
var newModel = {};
var newSchema = {
type: 'object',
properties: {
}
};
var newForm = [
];
var groupIndex = key;
// build dynamic form on a md-card
if(value.Group != undefined){
var template = '<md-card> ' +
'<form>' +
'<p>' + value.Group.GroupName + '</p>' +
'<div sf-schema="schema['+ groupIndex +']" sf-form="form[' + groupIndex +']" sf-model="model['+ groupIndex +']">' +
'</form>' +
'</md-card>'
$('#dynamicFormDiv').append(template);
// go through each group field
angular.forEach(value.Group.GroupFields, function(value, key){
var fieldType = value.Field.Type;
switch (fieldType) {
case 'Checkbox':
var newProperty = {
type: 'array',
items: {
type: 'string',
enum: []
}
}
// go through field options to create enum list
if(value.Field.FieldOptions.length > 0){
var propArray = [];
var titleMapArray = [];
angular.forEach(value.Field.FieldOptions, function(value, key){
propArray.push(value.Id);
titleMapArray.push({value: value.Id, name: value.Value})
});
newProperty.items.enum = propArray;
}
eval('newSchema.properties.checklist' + key + '= newProperty;');
var newFormObject = {
key: 'checklist' + key,
type: 'checkboxes',
titleMap: titleMapArray
};
newForm.push(newFormObject);
break;
default:
break;
}
});
}
$scope.model.push(newModel);
$scope.schema.push(newSchema);
$scope.form.push(newForm);
});
// add the finalize panel and fields
}