Ngx-bootstrap: Datepicker [minDate] & [bsConfig] not working with AOT

[Scooviese]

Hey everyone!

I'm trying to convince your datepicker to use [minDate], [bsConfig] and [bsValue]. This works perfectly fine when testing locally, but on production we use AOT & Uglify and it's not working.

Using:
Angular 4.2.6
Angular/CLI 1.4.3
Webpack 3.5.6
ngx-bootstrap 1.9.3

Error:

ERROR in Template parse errors:
      Can't bind to 'minDate' since it isn't a known property of 'input'. ("
                  <input type="text"
                      class="form-control"
                      [ERROR ->][minDate]="minDate"
                      #dp="bsDatepicker"
                      placeholder="Click to toggle")

Have you had that issue? Any hints on that?

[valorkin]

1. rule of thumb, always do AoT build (even without prod)
2. nearest parent module of this component doesn't have BsDatepicker module
3. plus I don't see bsDatepicker attribute on this input
4. please search issues for since it isn't a known property of there are so many things

Thanks for providing versions :+1:

[Scooviese]

Hey,

thanks for the help (I did search the interwebs a lot before posting here). I don't know why the error message in our build swallowed the "bsDatepicker", but this is the actual code:

<input type="text"

class="form-control"

[minDate]="minDate"

#dp="bsDatepicker"

placeholder="Click to toggle date picker"

(bsValueChange)="arrivalUpdated($event)"

bsDatepicker

value="{{ arrivalDate | date: 'shortDate' }}"

[(ngModel)]="arrivalDate">

The component itselft imports
import { BsDatepickerModule } from 'ngx-bootstrap/datepicker' ;

[Kurara]

Here https://github.com/valor-software/ngx-bootstrap/issues/2716
nuked said:

in my case i put BsDatepickerModule.forRoot() in global app.module.ts, but then I forgot to import same module inside of child module as well.

And that was my problem too. Maybe it's also yours.