Сценарий типа, приведенный в сообщении об ошибке, должен содержать значение для идентификатора имени формы управления

Question

Я получаю следующую ошибку: Ошибка: необходимо указать значение для элемента управления формы с именем: 'id'. хотя я предоставил значение для того же и вот мой машинописный код

import { Component, OnInit,Inject } from '@angular/core';
import {MatDialog,MatDialogRef,MAT_DIALOG_DATA} from '@angular/material';
import {FormGroup,FormBuilder,Validators} from '@angular/forms';
import {AdminService} from '../../services/admin.service';
@Component({
  selector: 'app-subcategory-modal',
  templateUrl: './subcategory-modal.component.html',
  styleUrls: ['./subcategory-modal.component.css']
})
export class SubcategoryModalComponent implements OnInit {
   subcategoryForm:FormGroup;
   category:any;
  constructor(public subCategoryDialogref:MatDialogRef<SubcategoryModalComponent>,@Inject(MAT_DIALOG_DATA)public data:string,private formBuilder:FormBuilder,private service:AdminService)
   {
      this.generateCategory();
   }

  ngOnInit() {
    this.createForm();
    this.generateSubcategory(this.data);

  }
   createForm()
   {
     this.subcategoryForm=this.formBuilder.group({
       id:[null,Validators.required],
       subcategoryName:[null,Validators.required],
       category:[null,Validators.required]
     });
   }
   generateSubcategory(data)
   {

     this.service.getSubcategorys(data).subscribe(res=>{
         console.log(res.result);
     this.subcategoryForm.setValue({
       id:res.result.Name
     });
     },err=>{

     });
   }
   generateCategory()
   {
     this.service.getCategory().subscribe(res=>{
       this.category=res;
     });
   }
}

и это мой HTML-код: -

<form [formGroup]="subcategoryForm">
  <div class="form-group">
    <input type="text" class="form-control" formControlName="id"value="" name="id">
    </div>
  <div class="form-group">
    <input type="text" class="form-control" formControlName="subcategoryName" name="subcategoryName" >
  </div>
  <div class="form-group">
  <select class="form-control" name="category" formControlName="category">
      <option value="0">-Select-</option>
      <option  *ngFor="let data of category?.result" value="{{data.id}}">{{data.Name}}</option>
    </select>
  </div>
  <div class="form-group text-center">
    <button type="button" class="btn btn-primary" name="button">Update</button>
  </div>
</form>

Может кто-нибудь сказать мне, где я иду не так? и почему эта ошибка продолжает происходить?

Answer 1

Поскольку вы хотите изменить только значение элемента управления id, вы должны использовать patchValue вместо setValue метода, чтобы изменить значение этого formControl.

this.subcategoryForm.patchValue({
       id:res.result.Name
});

, если вы хотите использовать setValue метод, вы можете вызвать его из formControl id:

this.subcategoryForm.controls['id'].setValue(res.result.Name);