1, 表单
详细的参考文档:表单的深度封装
1,控制表单子组件
//HTML文件,模板变量 myForm
<plx-form #myForm [settings]="myFormParmsSettings"></plx-form>
//TS文件,使用ViewChild获取模板变量
@ViewChild('myForm') srTunnelForm: any;
//表单项
{
name: 'item',
label: '项目',
type: FieldType.CUST_COMPONENT,
component: sonComponent,
},
//获取子组件实例
let constraintInstance = this.srTunnelForm.cunstomComponents['item'].instance;
2,获取表单对象
//第一种方式
this.myFormParmsObject = this.myFormParmsSettings.formObject;
//第二种方式
this.myFormParmsObject = this.myForm.getFormObject();
3,表单项为组件时,如何使用校验
outputs:{
onClick: (event)=>{
this.myFormParmsObject.controls['time'].setValue(event.date);
this.myFormParmsObject.controls[‘time’].markAsDirty(); //makeAsDirty是为了让提示信息立即显示
}
}
onClick是子组件自定义的事件,通过setValue()方法直接改变time项的状态。
- 1,已经用于必须填入项的校验。2021.03.01
4, 表单项中callback方法与默认值
- 如果设置了默认值,页面初始化的时候会触发callback方法。
- 不管是否设置了默认值,setValue()都会触发callback方法。
5,表单项设置hidden
通过查看element内容,发现当表单项设置hidden为true时,它的element内容还是有的,只是在页面上不显示。