使用反应式驱动表单angular 11的错误验证
使用反应式驱动表单angular 11的错误验证
提问于 2021-01-04 08:38:01
也许一个经验丰富的全栈开发人员可以在这方面提供帮助-(不是问题，更多的研究和开发)我有一个任务，我必须在我们新的angular 11平台上编写验证，他们希望它是反应式驱动的验证，这很好，我的主要问题是，假设我们的数据库中有一个XML文件，xml包含所有的业务规则验证，我该如何从数据库调用XML到我的angular组件中以匹配这些值，如果它匹配验证，它应该输出一个错误。我理解模板驱动，但在调用xml文件试图与这些值匹配时，我理解反应驱动，这就是我被困住的地方。我唯一的猜测是编写一个调用xml的服务，将其转换为JSON、OBJ等。
回答 1
Stack Overflow用户
发布于 2021-01-04 13:07:31
是的，最好的选择就是将xml转换成json，然后就可以动态创建reactive forms了。我做了一些类似的事情，比如我有json，它有所有的表单创建规则(validaitons，feidl名称等)
let formFields = [
{
name: 'pickupLocations',
isRequired: true,
isArray: true,
nestedFieldsArr: [
{
name: 'location',
isRequired: true
},
{
name: 'lat',
isRequired: false
},
{
name: 'long',
isRequired: false
},
{
name: 'locationCode',
isRequired: false
},
{
name: 'dateTime',
isRequired: true
}
]
},
{
name: 'deliveryLocations',
isRequired: true,
isArray: true,
nestedFieldsArr: [
{
name: 'location',
isRequired: true
},
{
name: 'lat',
isRequired: false
},
{
name: 'long',
isRequired: false
},
{
name: 'locationCode',
isRequired: false
},
{
name: 'dateTime',
isRequired: true
}
]
},
{
name: 'bidVehicles',
isRequired: true,
isArray: true,
nestedFieldsArr: [
{
name: 'vehicleLoadId',
isRequired: true
},
{
name: 'numberOfVehicles',
isRequired: true
},
{
name: 'loadRequirementId',
isRequired: false,
defaultValue: 1
}
]
},
{
name: 'shipmentWeight',
isRequired: true
},
{
name: 'budgetMin',
isRequired: true
},
]现在我有了动态创建表单的函数，如下所示
createForm(fieldsArr: any[]) {
let formObject = {};
fieldsArr.forEach(f => {
formObject[f.name] = f.isArray ? this.fb.array([this.createArrayType(f.nestedFieldsArr)]) : [f.defaultValue ? f.defaultValue : '', f.isRequired ? Validators.required : Validators.nullValidator]
})
return this.fb.group(formObject);
}
createArrayType(nestedFieldsArr: any[]) {
let nestedFormObj = {};
nestedFieldsArr.forEach(f => {
nestedFormObj[f.name] = [f.defaultValue ? f.defaultValue : '', f.isRequired ? Validators.required : Validators.nullValidator]
})
let form = this.fb.group(nestedFormObj);
return form;
}这样我就有了一个包含所有validation规则、字段名和nested array fields的json。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65556406
复制相关文章
相似问题
腾讯云开发者
