Search code examples
angularng2-bootstrap

ng2-bootstrap - timepicker change() event not working

While using Angular 2's ng2-bootstrap plugin I cannot get the timepicker change() event to work. This can be demonstrated on the example page (http://valor-software.com/ng2-bootstrap/index-bs4.html#/timepicker).

In the "typescript" section of the example page you will find the changed() function. When you (change) a timepicker the console log will not fire, which shows that the changed() function is never called.

// template:
<timepicker [(ngModel)]="mytime" (change)="changed()" [hourStep]="hstep" 
            [minuteStep]="mstep" [showMeridian]="ismeridian" 
            [readonlyInput]="!isEnabled"></timepicker>

// @Component:
public changed():void {
  console.log('Time changed to: ' + this.mytime);
};

Am I misunderstanding how timepicker's (change) event is implemented or is the event broken?

Solution

  • Have you tried using (ngModelChange)?

    As Stephan mentioned above, using (ngModelChange) will fix the problem.