<mat-form-field>
          <mat-select placeholder="Select a service" required (change)="changeService($event.value)">
            <mat-optgroup *ngFor="let serviceGroup of serviceGroups" [label]="serviceGroup.serviceGroupName">
              <mat-option *ngFor="let service of serviceGroup?.services" [value]="service">
                {{service?.serviceName}}
              </mat-option>
            </mat-optgroup>
          </mat-select>
        </mat-form-field>

  ngOnInit() {
this.serviceGroupService.serviceGroups.subscribe(sg => {});

this.selectedService.serviceId = this.bookingservicetime.serviceTime.service.serviceId;
this.selectedServiceTime = this.bookingservicetime.serviceTime;
}