如何在离子日期时间中将我的开始时间和结束时间分隔30分钟

Question

我正在使用primeng日历来管理医疗约会的日程，当我选择医生的日期时，我希望他的开始时间和结束时间分为30分钟，并显示在html中。这是我医生的计划数据的json渲染：[{"id":18,"planning":null,"day":"Lundi","startHour":"08:00","endHour":"17:00","isFree":true},{"id":19,"planning":null,"day":"Mardi","startHour":"09:00","endHour":"18:00","isFree":true},{"id":20,"planning":null,"day":"Mercredi","startHour":"10:00","endHour":"19:00","isFree":true},{"id":21,"planning":null,"day":"Jeudi","startHour":"11:00","endHour":"20:00","isFree":true},{"id":22,"planning":null,"day":"Vendredi","startHour":"12:00","endHour":"21:00","isFree":true},{"id":23,"planning":null,"day":"Samedi","startHour":"00:00","endHour":"00:00","isFree":false},{"id":24,"planning":null,"day":"Dimanche","startHour":"00:00","endHour":"00:00","isFree":false}]

而且我想在给定的一天里，我的html以30分钟的分钟显示我的医生时间（开始和结束时间）。这是我检索医生计划数据的地方：

 private loadDocdate() {

    this.httpClient.get<UserResponse>('http://127.0.0.1:8000/api/medecin/details/' + this.medecinId, this.options).subscribe((data: any) => {
      this.DocPlanning = data.medecin.planning;
      console.log(JSON.stringify(this.DocPlanning.planningLines));
    });
  } 

还有我的HTML：

<ion-content fullscreen>
  <ion-text style="font-weight: bold; text-align: center">Choisissez votre Date</ion-text>
  <p-calendar [hidden]="dateValue" [(ngModel)]="dateValue" [inline]="true" [locale]="fr" dateFormat="dd-mm-yy"
  (click)="presentAlert()">
  </p-calendar>
   <div>
    <p-calendar [hidden]="!dateValue" [(ngModel)]="value" [timeOnly]="true" hourFormat="24"
     ></p-calendar>
  </div>
</ion-content>

我想要一个类似图片的显示器：

谢谢

Answer 1

您可以使用momentjs进行及时计算