[Object][Object] angular-CodePudding

I'm trying to display the value in my form why i get [Object][Object] in my display i tried the ngModel but i have a validators

this is the out

TS

 ngOnInit(): void {
    this.Form = this.fb.group({
      Code:  ({value:this.idObj,}, Validators.required),
    }

getNextDRId(){
  this.micro.getNextId().subscribe((response: string) =>{
    this.idObj = response;
    console.log(this.idObj)
  })
}

.HTML

  <mat-form-field >
                <mat-label>Id</mat-label>
                <input matInput type="text" formControlName="Code">
            </mat-form-field>

CodePudding user response：

You're not meant to bind properties to the form. Just access the form directly:

  ngOnInit(): void {
    this.Form = this.fb.group({
      Code: ['', Validators.required],
    });
  }

  getNextDRId() {
    this.micro.getNextId().subscribe((response: string) => {
      this.Form.get('Code')?.setValue(response);
    });
  }

You can create getters for convenience:

  get Code() {
    return this.Form.get('Code')!;
  }

  getNextDRId() {
    this.micro.getNextId().subscribe((response: string) => {
      this.Code.setValue(response);
    });
  }