Angular 2 - 动态组件模板 - 如何按需克隆 FormControl
Angular 2 - Dynamic component template - how to clone a FormControl on demand
我实现了一个动态数据table,目前一切顺利,
在table的底部,有一行包含一些列的输入,允许用户添加一条新记录,每添加一行是editable
我的问题是,当我内联编辑一行时,我需要相同的验证,所以我需要克隆我为底行定义的 FormControl
这是我在代码中使用的定义示例,当我实例化我的数据 table 组件(对于一列)
...,
{
name: this.getTrad('Points'),
value: 'points',
width: 100,
type: DataTableComponent.INPUT,
editable:true,
numeric:true,
validationControl:
new FormControl({ value: '', disabled: false },
[Validators.required,
Validators.minLength(1),
Validators.maxLength(100)
])
},
那么,我如何克隆 FormControl 以将其分配给动态创建的输入?
我检查了一个 FormControl 实例,没有验证器的访问器?
到目前为止,我唯一的想法是为我的组件提供每列的验证器数组,而不是整个 FormControl 实例
如果有人有更好的主意....
谢谢
我刚遇到这个问题。我用一个普通的新实例解决了以下用例:
@Component({...})
export class FooDialogComponent {
formControl: FormControl;
constructor(@Inject(MAT_DIALOG_DATA) public data: { system: number, control: AbstractControl }, // TODO define interface
public dialogRef: MatDialogRef<UpdateQuantityDialogComponent>)
{
this.formControl = new FormControl(this.data.control.value, this.data.control.validator);
}
}
通过这种方法,formControl
与注入的 AbstractControl
.
具有相同的 state
和 validators
Ofc,如果控件的 value
不是基本类型,则需要执行(深)复制。
希望对您有所帮助
我实现了一个动态数据table,目前一切顺利,
在table的底部,有一行包含一些列的输入,允许用户添加一条新记录,每添加一行是editable
我的问题是,当我内联编辑一行时,我需要相同的验证,所以我需要克隆我为底行定义的 FormControl
这是我在代码中使用的定义示例,当我实例化我的数据 table 组件(对于一列)
...,
{
name: this.getTrad('Points'),
value: 'points',
width: 100,
type: DataTableComponent.INPUT,
editable:true,
numeric:true,
validationControl:
new FormControl({ value: '', disabled: false },
[Validators.required,
Validators.minLength(1),
Validators.maxLength(100)
])
},
那么,我如何克隆 FormControl 以将其分配给动态创建的输入? 我检查了一个 FormControl 实例,没有验证器的访问器?
到目前为止,我唯一的想法是为我的组件提供每列的验证器数组,而不是整个 FormControl 实例
如果有人有更好的主意....
谢谢
我刚遇到这个问题。我用一个普通的新实例解决了以下用例:
@Component({...})
export class FooDialogComponent {
formControl: FormControl;
constructor(@Inject(MAT_DIALOG_DATA) public data: { system: number, control: AbstractControl }, // TODO define interface
public dialogRef: MatDialogRef<UpdateQuantityDialogComponent>)
{
this.formControl = new FormControl(this.data.control.value, this.data.control.validator);
}
}
通过这种方法,formControl
与注入的 AbstractControl
.
state
和 validators
Ofc,如果控件的 value
不是基本类型,则需要执行(深)复制。
希望对您有所帮助