doctor schedule table html

<section id="group-doctor-schedule-table">
  <div class="row">
    <div class="col-md-12" innerHTML="{{resultMessage}}">
    </div>
    <div class="col-md-12">
      <!--<div class="row">-->
        <!--<div class="col-md-3">-->
          <!--<div class="alert alert-success" role="alert">-->
            <!--{{reloadMessage}}-->
          <!--</div>-->
        <!--</div>-->
      <!--</div>-->
      <form [formGroup]="postScheduleForm" novalidate (ngSubmit)="editSchedule(postScheduleForm)">
            <table class="table table-bordered">
              <thead>
                <tr>
                  <th colspan="6">{{doctorName}}</th>
                </tr>
                <tr>
                  <th style="width:200px;">Date</th>
                  <th colspan="3">Time</th>
                  <th>Room</th>
                  <th>Action</th>
                </tr>
              </thead>

              <tbody>
              <tr>
                  <td>
                    <select class="form-control custom-select" formControlName="new_day" [(ngModel)]="addNew.day" >
                      <option value="">---</option>
                      <option value="Monday">Monday</option>
                      <option value="Tuesday">Tuesday</option>
                      <option value="Wednesday">Wednesday</option>
                      <option value="Thursday">Thursday</option>
                      <option value="Friday">Friday</option>
                      <option value="Saturday">Saturday</option>
                      <option value="Sunday">Sunday</option>
                    </select>
                  </td>
                  <td>
                    <input type="time" formControlName="new_time_start" value="" class="form-control">
                  </td>
                  <td> - </td>
                  <td>
                    <input type="time" formControlName="new_time_end" value="" class="form-control">
                  </td>
                  <td>

                    <select formControlName="new_room" [(ngModel)]="addNew.room" class="form-control custom-select" disabled>
                      <option *ngFor="let room of roomList let i=index" value="{{room.room_id}}" [selected]="'e879620b-cc0a-4a40-b038-4275edd64859'">{{room.name}}</option>
                    </select>

                  </td>
                  <td>
                    <!--<button class="btn btn-light" (click)="addNewForm()">Save</button>-->
                    <button class="btn btn-light">Save</button>
                  </td>
              </tr>
              </tbody>

              <!--<tbody formArrayName="sch">-->
              <!--<div *ngFor="let schedule of postScheduleForm.controls.sch.controls; let i=index">-->
                <!--<tr [formGroupName]="i">-->
                  <!--<td>-->
                    <!--<input type="text" value="" formControlName="schedule_id" style="display: none" #sch_id>-->
                    <!--<select class="form-control custom-select" formControlName="day" #sch_day>-->
                      <!--<option value="">-&#45;&#45;</option>-->
                      <!--<option value="Monday">Monday</option>-->
                      <!--<option value="Tuesday">Tuesday</option>-->
                      <!--<option value="Wednesday">Wednesday</option>-->
                      <!--<option value="Thursday">Thursday</option>-->
                      <!--<option value="Friday">Friday</option>-->
                      <!--<option value="Saturday">Saturday</option>-->
                      <!--<option value="Sunday">Sunday</option>-->
                    <!--</select>-->
                  <!--</td>-->
                  <!--<td>-->
                    <!--&lt;!&ndash;<ngb-timepicker formControlName="time_start"></ngb-timepicker>&ndash;&gt;-->
                    <!--<input type="time" formControlName="time_start" value="" class="form-control" #sch_time_start>-->
                  <!--</td>-->
                  <!--<td> - </td>-->
                  <!--<td>-->
                    <!--&lt;!&ndash;<ngb-timepicker formControlName="time_end"></ngb-timepicker>&ndash;&gt;-->
                    <!--<input type="time" formControlName="time_end" value="" class="form-control" #sch_time_end>-->
                  <!--</td>-->
                  <!--<td>-->
                    <!--&lt;!&ndash;<input type="text" value="e879620b-cc0a-4a40-b038-4275edd64859" formControlName="room" #sch_room>&ndash;&gt;-->
                    <!--<select class="form-control custom-select" formControlName="room" #sch_room>-->
                      <!--<option *ngFor="let room of roomList let i=index" value="{{room.room_id}}" [selected]="'e879620b-cc0a-4a40-b038-4275edd64859'">{{room.name}}</option>-->
                    <!--</select>-->

                  <!--</td>-->
                  <!--<td>-->
                    <!--<button class="btn btn-light">Save</button>-->
                    <!--<a class="btn btn-light" (click)="deleteSchedule(sch_id)">Delete</a>-->
                  <!--</td>-->

                <!--</tr>-->
              <!--</div>-->
              <!--</tbody>-->

              <tbody formArrayName="sch" *ngFor="let i=index; let day of scheduleList; let i=index;let schedule of postScheduleForm.controls.sch.controls; let i=index">
                <tr [formGroupName]="i">
                  <td>
                    <input type="text" value="{{day.schedule_id}}" formControlName="schedule_id" [ngModel]="day.schedule_id" style="display: none" #sch_id>
                    <select class="form-control custom-select" formControlName="day" [ngModel]="day.day" #sch_day>
                      <option value="">---</option>
                      <option value="Monday" [selected]="day.day == 'Monday'">Monday</option>
                      <option value="Tuesday" [selected]="day.day == 'Tuesday'">Tuesday</option>
                      <option value="Wednesday" [selected]="day.day == 'Wednesday'">Wednesday</option>
                      <option value="Thursday" [selected]="day.day == 'Thursday'">Thursday</option>
                      <option value="Friday" [selected]="day.day == 'Friday'">Friday</option>
                      <option value="Saturday" [selected]="day.day == 'Saturday'">Saturday</option>
                      <option value="Sunday" [selected]="day.day == 'Sunday'">Sunday</option>
                    </select>
                  </td>
                  <td>
                    <input type="time" formControlName="time_start" [ngModel]="day.time_start" value="{{day.time_start}}" class="form-control" #sch_time_start>
                  </td>
                  <td> - </td>
                  <td>
                    <input type="time" formControlName="time_end" [ngModel]="day.time_end" value="{{day.time_end}}" class="form-control" #sch_time_end>
                  </td>
                  <td>
                    <input type="text" disabled value="-" class="form-control">
                    <input type="text" style="display:none;" value="e879620b-cc0a-4a40-b038-4275edd64859" ngModel="e879620b-cc0a-4a40-b038-4275edd64859" formControlName="room" #sch_room>
                    <!--<select class="form-control custom-select" formControlName="room" #sch_room>-->
                      <!--<option *ngFor="let room of roomList let i=index" value="{{room.room_id}}" [selected]="'e879620b-cc0a-4a40-b038-4275edd64859'">{{room.name}}</option>-->
                    <!--</select>-->
                  </td>
                  <td>
                    <a class="btn btn-light" (click)="deleteSchedule(sch_id)">Delete</a>
                  </td>
                </tr>
              </tbody>
              <tbody>
                <tr>
                  <td colspan="6"><button class="btn btn-light">Save</button></td>
                </tr>
              </tbody>

            </table>
          </form>
      {{postScheduleForm.value | json}}
    </div>
  </div>
  <simple-notifications [options]="options"></simple-notifications>
</section>