Search code examples
angularng-bootstrapngb-datepicker

How to mark ngbDatepicker Valid in form even when no value is selected


I'm making use of ng-bootstrap's ngbDatepicker in a Reactive Form in an Angular2 project, and the dates are optional, however ngbDatepicker always marks the form as Invalid unless a date is selected.

Is there a way to exclude ngbDatepicker from the form validation, or to configure it so that it returns Valid whether it has a value set or not?


Solution

  • The issue was with how I was initializing the form values. I was setting the default values to empty strings where I should have been initializing the dates to null. So I was doing this:

      replicantForm = this.fb.group({
          name: ['', Validators.required],
          incepdate: '',
          longevity: ''
      })
    

    When I should have been doing this:

      replicantForm = this.fb.group({
          name: ['', Validators.required],
          incepdate: null,
          longevity: ''
      })
    

    Many thanks to @pkozlowski-opensource for the clarification.