ОШИБКА TypeError: Невозможно прочитать свойство 'serviceId' из неопределенного

Question

Я использую вложенный json в качестве входных данных для Angular 6, где ниже показано, как выглядит моя структура json:

{"contractId":1,"contractName":"Temp","contractServiceList":[{"id":1,"serviceId":{"serviceId":1,"serviceName":"Emergency Room"},"providerTier":"Tier 1","coinsurance":100.0,"copay":10.0,"penaltyApplies":"Y","penaltyRule":"Non Emergency ER Use","penaltyType":"Dollar Amount","penaltyValue":300.0,"deductibleApplies":"Y"}]}

В component.ts мой код:

export class AppComponent implements OnInit {
  services: Service;
  serviceId: ServiceId[];
  contract: Contract[];
  constructor(private formBuilder: FormBuilder, private router: Router, private contractService: ContractService) {  }

  addForm: FormGroup;
  ngOnInit() {
    this.serviceId = [
    {serviceId: '1', serviceName: 'Emergency Room'},
    {serviceId: '2', serviceName: 'OP Radiology'}
  ];

component.html:

 <div class="form-group col-xs-6">
      <label for="serviceName">Category Of Services:</label>
      <select id ="serviceName" formControlName="serviceName" name="serviceName" class="form-control">
    <option *ngFor="let serv of serviceId" [value]="serv.serviceId">{{serv.serviceName}}</option>
</select>
      </div>

Я отправляю все значения в форме как (ngSubmit) = "onSubmit" и подписываюсь, как показано ниже:

 onSubmit() {
    this.contractService.saveContract(this.addForm.value)
      .subscribe( data => {
alert('Contract created successfully');
      });
}

Не уверен, почему он не может принимать значение serviceId. Любая помощь заметна !!