NgbDatepicker in a popup looses default validation

Bug description:

I have a reactive form which has to dynamically add/remove validators from a formcontrol.

By default, the (input-)datepicker comes with a validation that makes sure that only valid strings can be entered. This validation is enabled even if the formcontrol is initialised without validator functions. This is fine and probably by design.

The issue is: When a call to formControls setValidators() or clearValidators() is made this default validator is removed and there is no way to re-enable it.

Imho: I think if there is a default “always on” validator, it has to survive clearValidators() and setValidators(). At least there should be a way to re-enable this validator.

Link to minimally-working StackBlitz that reproduces the issue:

https://stackblitz.com/edit/angular-iawtsn?file=app%2Fdatepicker-popup.ts

1. Enter manually via the input text field: 2019-08 => invalid error is shown
2. Click “clear validators” or “set required” button => invalid error is gone

Versions of Angular, ng-bootstrap and Bootstrap:

see stackblitz.

[03byron]

@divdavem Thank you! I did not knew that i can pass a reference of a datepicker as a validator to a FormControl. Although there are two points i don’t like about this solution:

1. I have to pass all datepicker components of the form as a reference to the service handling the reactive form.
2. Example: this.date.setValidators([this.datePicker, Validators.required]) Validators minDate & maxDate would have to be maintained on the component, whereas others (required, custom ones) would be maintained on the Formcontrol. See this stackblitz.

To me this feels like mixing template-driven and reactive forms.

@maxokorokov Apologies for the trouble #3126 has caused. I forgot to pass the FormControl value through the adapter when extracting the existing validation logic from datepicker-input. I would like to provide a PR with unit tests covering this in the future if you don’t mind.

IMHO its still a good idea to expose the validators. What do you think? Give it another chance?

[divdavem]

@03byron It looks like you can directly use the reference of the datepicker as a validator (as it implements the Validator interface). There is no need to have a separate object exposed (as implemented in #3126 but then reverted in #3219).

Here is a modified version of your stackblitz where I use the reference of the datepicker as a validator: https://stackblitz.com/edit/angular-iawtsn-r1d1vs?file=app%2Fdatepicker-popup.ts