Angular 4 - статус формы недействителен, но все поля формы управления статусом недействительны

Question

Я делаю форму редактирования, после привязки данных, которые поступают из бэкэнда, статус формы недействителен, однако все поля имеют действительный статус, как решить?

    createGerconForm(): FormGroup 
  {
    return this._fb.group({
      anexoGercon: new FormControl(),
      email: new FormControl('', Validators.required),
      name: new FormControl('', Validators.required),
      cpf: new FormControl('', [Validators.required,Validators.pattern(/\d{3}\.\d{3}\.\d{3}\-\d{2}/i)]),
      origem: new FormControl('', Validators.required),
      mes: new FormControl('', Validators.required),
      ano: new FormControl('', Validators.required),
      entradaCt:  new FormControl('', Validators.required),
      prazoDeAtendimento: new FormControl('', Validators.required),
      numeroCT: new FormControl('', Validators.required),
      responsavel: new FormControl('', Validators.required)
    });
  }


bindFormGercon()
  {

    this.email.setValue(this.vm.item.emailRecebido,{onlySelf:true});

    this.name.setValue(this.vm.item.nomeParticipante,{onlySelf:true});


    this.cpf.setValue(this.maskToCPF(this.vm.item.cPF),{onlySelf:true});

    this.ano.setValue(this.vm.item.ano,{onlySelf:true});


    this.entradaCt.setValue(this._dateTimeSvc.covertToDateObject(this.vm.item.entradaCt),{onlySelf:true});


    this.prazoDeAtendimento.setValue(this._dateTimeSvc.covertToDateObject(this.vm.item.prazoAtendimento),{onlySelf:true});


    this.numeroCT.setValue(this.vm.item.numeroCT,{onlySelf:true});


    this.origem.setValue(this.vm.item.origem.id, {onlySelf:true});


    this.responsavel.setValue(this.vm.item.responsavel.id,{onlySelf:true});


    this.mes.setValue(this.vm.item.mes,{onlySelf:true});

  }

Debug status of fields:


   <p>Email: {{emailRecebido.status}}</p> 
   <p>Name:  {{nomeParticipante.status}}</p> 
   <p>Cpf:   {{cpf.status}}</p> 
   <p>Origem: {{origem.status}}</p> 
   <p>Mes:     {{mes.status}}</p> 
   <p>Ano:    {{ano.status}}</p> 
   <p>entradaCT:  {{entradaNoContencioso.status}}</p> 
   <p>prazoDeAtendimento: {{prazoDeAtendimento.status}}</p>
   <p>numeroCT: {{numeroCT.status}}</p>
   <p>Responsavel: {{responsavel.status}}</p>
   <p>Anexo:  {{anexoGercon.status}}</p>
   <p>Form: {{gerconForm.status}}</p>

Result:

Email: VALID

Name: VALID

Cpf: VALID

Origem: VALID

Mes: VALID

Ano: VALID

entradaCT: VALID

prazoDeAtendimento: VALID

numeroCT: VALID

Responsavel: VALID

Anexo: VALID

Form: INVALID

Угловая версия: 4.2.4 У кого-нибудь когда-нибудь была такая проблема?

Answer 1

Кажется, что дубликат Кнопка Angular 4 отключена, даже если форма имеет допустимые значения

Вы можете использовать это решение для простой отладки вашей формы.

Цель состоит в том, чтобы отладить каждый элемент управления формы (например, вывести его в ваше представление) и найти, который остается недействительным.