I'm able to display the data fetched from an API in the input field in Angular 8 with error in the console

I'm using an reactive form where i'm fetching data from the api and displaying in the html in the input field but i'm getting some error in the console. Need help in solving.

Below is the HTML code

 <form [formGroup]="homeForm" class="form-horizontal" (ngSubmit)="continue(homeForm.value)">
                <div class="form-group">
                    <label class="control-label" class="text">Officer Name</label>
                    <input type="text" class="form-control" formControlName="oName" value={{this.home[0].oName}} readonly>
                </div>
                <div class="form-group">
                    <label class="control-label" class="text">Officer ID</label>
                    <input type="text" class="form-control" formControlName="oIDNum" readonly>
                </div>
  div align="end">
                    <button type="submit" class="btn btn-primary">Submit</button>
                </div>
            </form>

Below is the ts file code

   import { Component, OnInit } from '@angular/core';
   import { FormControl, FormGroup } from '@angular/forms';

   import{Router} from '@angular/router';
   import { ApiService } from '../app.service';


   @Component({
   selector: 'app-home',
   templateUrl: './home.component.html',
   styleUrls: ['./home.component.css']
 })
 export class HomeComponent implements OnInit {

  home:any

  constructor(private route:Router,private apiService:ApiService) { }

  ngOnInit() {
    this.apiService.getData().subscribe((data)=>{
    this.home = data;
    console.log(this.home);
    })

  }
 homeForm = new FormGroup({
   oName:new FormControl(''),
   oIDNum:new FormControl(''),
   })
 continue(value){
  console.log(value);
  this.route.navigate(['/form']);
  }
 }

This is the service file

  import { Injectable } from '@angular/core';
  import { HttpClient } from '@angular/common/http';

  @Injectable({
  providedIn: 'root'
  })
 export class ApiService {

 constructor(private httpClient: HttpClient) { }
 public getData(){
  return this.httpClient.get(`http://localhost:3000/officer`);
 }
}

JSON file data I'm using is below

{
 "officer":[ {
"oName": "Example",
"oIDNum": "1"
}]
}