Question

我有以下反应形式。我想要做的是复制表单的一部分并将其转换为新表单。

 this.myForm = this.formBuilder.group({
            group: this.formBuilder.group({
                name: 'Zero',
                lastName: 'Zeroo'
            }),
            name: 'One',
            array: this.formBuilder.array([
                { name: 'two'},
                { name: 'three'}
                ])
        });

使用以下代码，我尝试复制。

    let formControlKeys = Object.keys(this.myForm.value);
    this.myCopyForm = this.formBuilder.group({});
    for (let key of formControlKeys){
              console.log(typeof this.myForm.controls[key]);
              // prints object

              // code to create new FormControl / FormGroup / FormArray 
              // inside myCopyForm according to type got above
          }

所需的功能是获取reactive-form类型，而不仅仅是 object。

Answer 1

你走在正确的轨道上。这里的问题是，当您尝试console.log使用typeof关键字的类型时，您实际上获得了该事物的运行时Javascript类型，在这种情况下是{{1 }}。 Typescript是一种 compile-to-JS 语言，这意味着所有那些花哨的类型和接口都是仅用于静态类型检查。当您的代码进入浏览器时，所有类型信息都消失了，您正在寻找简单的旧Javascript。

因此，您在代码中引用它的object类型实际上就是您想要的an AbstractControl。您可以使用这些控件来构建表单的副本，如下所示：

this.myForm.controls[key]

有关this.copyForm = new FormGroup({}); for (let key of Object.keys(this.myForm.value)) { const control = this.myForm.controls[key]; // AbstractControl this.copyForm.addControl(key, control); } API的更多信息，请访问：https://angular.io/api/forms/FormGroup。

Angular - 查找表单组控件的类型

1 个答案: