DatePicker input: request for an @Output event when the calendar is closed

It would be nice if the datepicker input provided an @Output event to be emitted when the calendar popup is closed. I can provide a PR if you think you might merge that.

The reason is that I use the DatePicker input as readonly, and open the calendar popup on click. However, the input obviously blurs when that opens, and I would like my component that wraps the datepicker input to blur when the calendar popup is closed.

Is this something you are interested in?

1 possible answer(s) on “DatePicker input: request for an @Output event when the calendar is closed

  1. Yes, that’s clearly something that’s missing, just a couple of thoughts.
    I would add closing prevention, as it might provide a workaround for some of the custom [autoClose]-related issues.

    I think I’d suggest something like this for an API (just some ideas for discussion):

    export interface NgbDatepickerCloseEvent {
      preventDefault: () => void;
    }
    
    @Component(/**...**/)
    export class NgbInputDatepicker() {
    
      @Output() close = new EventEmitter<NgbDatepickerCloseEvent>()
    }

    Usage:

    <input ngbDatepicker (close)="onClose($event)" />
    onClose(event: NgbDatepickerCloseEvent) {
      // either just be notified or prevent closing
    }

    For the implementation, there is already a private Subject for internal notification on close: https://github.com/ng-bootstrap/ng-bootstrap/blob/master/src/datepicker/datepicker-input.ts#L65

    I guess the event emitter should trigger it unless the event was prevented.