用通用函数替换2个特定函数
问题描述:
用动态添加输入字段创建表单。用通用函数替换2个特定函数
- 我宣布我formsGroup
- 构建控制
-
addPers()
和addBacklogs()
创造新的领域。
我会通过一个功能和参数替换这些2个funtions我选择我要在这里建立一个原型的我所想象的字段:
addField(groupparam: FormGroup, fieldparam : FormArray, functionAdd: FormGroup): void {
const control = <FormArray> this.<groupparam>.controls[fieldparam];
control.push(this.<functionAdd()>);
}
这里是我的TS文件
export class AjoutProjetComponent implements OnInit {
isLinear = false;
firstFormGroup: FormGroup;
secondFormGroup: FormGroup;
thirdFormGroup: FormGroup;
constructor(private _formBuilder: FormBuilder) {}
ngOnInit() {
this.firstFormGroup = this._formBuilder.group({
leadProj: ['', Validators.required],
nomProj: ['', Validators.required],
descProj: ['', Validators.required],
besProj: ['', Validators.required],
});
this.secondFormGroup = this._formBuilder.group({
pers: this._formBuilder.array([this.createItem()])
});
this.thirdFormGroup = this._formBuilder.group({
backlog: this._formBuilder.array([this.createFonct()])
});
console.log(this.secondFormGroup);
}
createItem(): FormGroup {
return this._formBuilder.group({
name: ['', Validators.required],
poste: ['', Validators.required],
});
}
createFonct(): FormGroup {
return this._formBuilder.group({
fonctionnalite: ['', Validators.required],
userStory: ['', Validators.required],
});
}
deleteItem(index: number) {
const control = <FormArray> this.secondFormGroup.controls['pers'];
control.removeAt(index);
}
addPers(): void {
const control = <FormArray> this.secondFormGroup.controls['pers'];
control.push(this.createItem());
}
addBacklog(): void {
const control = <FormArray> this.thirdFormGroup.controls['backlog'];
control.push(this.createFonct());
}
然后在HTML而不是通过AddBacklog()
或AddItem()
我会通过一个相同的函数与足够的参数addField(groupparam, fieldparam, functionAdd)
答
我不确定我是否理解你的权利,但我认为你的解决方案将工作得很好。例如,你可以使用字符串:
addField(groupparam: string, fieldparam: string, functionAdd: string): void {
const control = <FormArray> this[groupparam]controls[fieldparam];
control.push(this[functionAdd]()>);
}
然后像做
this.addField('secondFormGroup', 'pers', 'createItem')
在你的代码。
无论这是整个用例的最佳解决方案,您必须知道。
听起来像个好主意?你的问题是什么? – mvuajua
如何用一个函数替换这两个函数? (原型中指定) – infodev