用通用函數替換2個特定函數

Question

用動態添加輸入字段創建表單。

1. 我宣佈我formsGroup
2. 構建控制
3. 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)

Answer 1

我不確定我是否理解你的權利，但我認爲你的解決方案將工作得很好。例如，你可以使用字符串：

addField(groupparam: string, fieldparam: string, functionAdd: string): void { 

    const control = <FormArray> this[groupparam]controls[fieldparam]; 
    control.push(this[functionAdd]()>); 
} 

然後像做

this.addField('secondFormGroup', 'pers', 'createItem') 

在你的代碼。

無論這是整個用例的最佳解決方案，您必須知道。