javascript - formatera ngb-timepicker så att den returnerar som en sträng och inte som ett objekt

Jag försöker få ngb-timepicker att returnera en sträng istället för ett objekt. För tillfället returnerar den följande:

{
  "hour": 13,
  "minute": 30
}

men jag skulle vilja att det återvände på det här sättet:

"13:30"

Detta är min html:

    <div class="calender"> <ngb-datepicker #dp 
[(ngModel)]="model"></ngb-datepicker>


<ngb-timepicker [(ngModel)]="time"></ngb-timepicker>

Med datepicker kunde jag omformatera det från ett objekt till en sträng med detta:

 constructor(private dateFormatter: NgbDateParserFormatter) {
const string_date = this.dateFormatter.format(this.model);
}

Finns det en version av NgbDateParserFormatter som fungerar med tid?

Svar #1

Syntaxen [(ngModel)] kan bara ställa in en databunden egenskap. Om du behöver göra något mer eller något annat kan du skriva den utökade formen. Egenskapsbindningen [ngModel] tar hand om att uppdatera det underliggande input-DOM-elementet. Händelsebindningen (ngModelChange) meddelar omvärlden när det har skett en förändring i DOM.

HTML

 <ngb-timepicker [(ngModel)]="time" (ngModelChange)="onTimeChange($event)"></ngb-timepicker>
    <hr>
    <pre>{{newTime}}</pre>

Komponent

export class AppComponent  {
  name = 'Angular 6';
  public newTime:string='13:30';
  time = {hour: 13, minute: 30};
onTimeChange(value:{hour:string,minute:string})
{
   console.log(value)
   this.newTime=`${value.hour}:${value.minute}`;
}

}

Live-demo