Error - jb-input-datepicker' is not a known element:

[santiim]

Hello! I'm having a problem, following the steps indicated

1- Install angular2-datepickr via npm

2 - In my app.module.ts import

Import {Angular2DatepickerModule, Angular2DatepickerOptions} from 'angular2-datepickr / angular2-datepickr';

and

@NgModule ({    Imports:      BrowserModule,      HttpModule,      FormsModule,      ReactiveFormsModule,      routing,      Angular2DatepickerModule,      CommonModule      ],

4 - And lastly, incorporate in the html of the component:

I get the following error:

**'jb-input-datepicker' is not a known element:

1. If 'jb-input-datepicker' is an Angular component, then verify that it is part of this module.
2. If 'jb-input-datepicker' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. (" -->**

Any ideas how to solve it ?? thank you very much!

[JiriBalcar]

Do you have it in lazy loaded module? If you adding it to the component template in lazy route you have to add it to the imports in module which is lazy loaded.

On Fri, Nov 11, 2016, 15:21 Santiago Martini notifications@github.com wrote:

Hello! I'm having a problem, following the steps indicated 1- Install angular2-datepickr via npm 2 - In my app.module.ts import

Import {Angular2DatepickerModule, Angular2DatepickerOptions} from 'angular2-datepickr / angular2-datepickr';

and

@NgModule https://github.com/NgModule ({ Imports: BrowserModule, HttpModule, FormsModule, ReactiveFormsModule, routing, Angular2DatepickerModule, CommonModule ], 4 - And lastly, incorporate in the html of the component:

I get the following error:

**'jb-input-datepicker' is not a known element:

1. If 'jb-input-datepicker' is an Angular component, then verify that it is part of this module.
2. If 'jb-input-datepicker' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. (" -->**

Any ideas how to solve it ?? thank you very much!

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/JiriBalcar/angular2-datepicker/issues/1, or mute the thread https://github.com/notifications/unsubscribe-auth/AGkHsiItKWelXpLMMMYx4sc-63nFbtDgks5q9HnugaJpZM4KvylR .

[santiim]

Thanks for your answer JiriBalcar! , I do not have it lazy loaded module

[JiriBalcar]

Try changing the imports part to Angular2DatepickerModule.forRoot(new Angular2DatepickerOptions({ todayString: 'TODAY' }))

[JiriBalcar]

@santiim are you still having this issue?

[santiim]

Hi jiriBalcar, thanks for asking, if I have not solved it yet, if you are interested in trying, I am trying to incorporate it into the following project: https://github.com/moizKachwala/Angular2-express-mongoose-gulp-node-typescript

If you manage to do it, I would appreciate it very much, without compromise;)

[JiriBalcar]

OK i did managed to make it work in your seed project.

You have to install moment js npm install moment which is requirement for the datepicker. Another requirement is material icons for the back and next buttons. (I am working on removing this requirement)

Then I had to make changes to datepicker components itself and uncoment moduleId: module.id for systemjs.

Then you need to make changes to your systemjs file. So Systemjs knows where to find the library and moment:

var map = {
    'app':                        'app', // 'dist',
    '@angular':                   (isPublic)? '@angular' : 'node_modules/@angular',
    'rxjs':                       (isPublic)? 'rxjs' : 'node_modules/rxjs'
  };
  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-datepickr':         { main: 'angular2-datepickr.js', defaultExtension: 'js'},
    'moment':                     { main: 'moment.js', defaultExtension: 'js' }

There are still some bugs:

1. with default options for today button string which can be workarounded with Angular2DatepickerModule.forRoot(new Angular2DatepickerOptions({todayString: 'TODAY'}))

[santiim]

Thank you very much!! I really appreciate your time and dedication, now I will implement your solution! regards!

[JiriBalcar]

Glad to help @santiim. I will leave this issue open until I change the dependency on material icons and the default options. So you can get notified about new version.

[JiriBalcar]

From 0.3.4-beta2 there is removed dependency on material icons.

You can try it npm install angular2-datepickr@beta