Angular动态表单的FormControl名称被清除
创始人
2024-10-24 14:01:02
0

问题描述: 在Angular动态表单中,当我改变FormControl的名称时,新名称被清除。

解决方法: 要解决这个问题,需要在表单控件的父组件中使用FormArray来动态添加和删除表单控件。在添加或删除表单控件时,遵循以下步骤:

  1. 创建一个FormArray对象,并在组件的构造函数中初始化它。

    import { FormArray, FormControl, FormGroup } from '@angular/forms';
    
    export class AppComponent {
      form: FormGroup;
    
      constructor() {
        this.form = new FormGroup({
          controls: new FormArray([])
        });
      }
    }
    
  2. 在模板中使用FormArray来动态添加和删除表单控件。

  3. 在组件中添加相应的添加和删除表单控件的方法。

    import { Component } from '@angular/core';
    import { FormArray, FormControl, FormGroup } from '@angular/forms';
    
    export class AppComponent {
      form: FormGroup;
    
      constructor() {
        this.form = new FormGroup({
          controls: new FormArray([])
        });
      }
    
      addControl() {
        const controls = this.form.get('controls') as FormArray;
        controls.push(new FormControl(''));
      }
    
      removeControl(index: number) {
        const controls = this.form.get('controls') as FormArray;
        controls.removeAt(index);
      }
    }
    

现在,当你添加或删除表单控件时,FormControl的名称不会被清除。

相关内容

热门资讯

攻略辅助挂!四川血战到底攻略!... 攻略辅助挂!四川血战到底攻略!竟然是真的有开挂辅助挂(揭秘有挂)-哔哩哔哩运四川血战到底攻略辅助工具...
日前!wepoker插件程序!... 日前!wepoker插件程序!一贯存在有开挂辅助攻略(讲解有挂)-哔哩哔哩1、实时wepoker插件...
为切实保障!微信中至有辅助吗!... 为切实保障!微信中至有辅助吗!果然是真的有开挂辅助教程(有挂功能)-哔哩哔哩微信中至有辅助吗能透视中...
目前来看!新畅游互娱科技!切实... 目前来看!新畅游互娱科技!切实存在有开挂辅助工具(揭秘有挂)-哔哩哔哩1、起透看视 新畅游互娱科技辅...
备受关注的!新星游辅助软件下载... 备受关注的!新星游辅助软件下载!本来真的是有开挂辅助方法(有挂攻略)-哔哩哔哩1、完成新星游辅助软件...
连日来!闲逸碰胡外桂!本来真的... 连日来!闲逸碰胡外桂!本来真的有开挂辅助挂(揭秘有挂)-哔哩哔哩1)闲逸碰胡外桂有没有挂:进一步探索...
黑科技教程!宝宝吃吃吃外g挂!... 黑科技教程!宝宝吃吃吃外g挂!竟然是真的有开挂辅助软件(有挂技巧)-哔哩哔哩一、宝宝吃吃吃外g挂可以...
第三方插件!潮汕掌上娱破解!一... 第三方插件!潮汕掌上娱破解!一直真的是有开挂辅助技巧(真的有挂)-哔哩哔哩1、进入到潮汕掌上娱破解是...
黑科技技巧!约战竞技场辅助器!... 黑科技技巧!约战竞技场辅助器!确实真的是有开挂辅助软件(真是有挂)-哔哩哔哩1、上手简单,内置详细流...
据通报!隶属茶苑苹果手机辅助!... 据通报!隶属茶苑苹果手机辅助!切实存在有开挂辅助挂(有挂攻略)-哔哩哔哩1、据通报!隶属茶苑苹果手机...