Closed voidbrain closed 3 years ago
Now I'm getting NullInjectorError: No provider for InjectionToken NB_TIME_PICKER_CONFIG!. What's the problem?
SOLVED Needed to import NbDatepickerModule NbTimepickerModule in the module
I have the same problem. And I have both NbDatepickerModule
and NbTimepickerModule
injected.
ERROR NullInjectorError: R3InjectorError(PagesModule)[InjectionToken NB_TIME_PICKER_CONFIG -> InjectionToken NB_TIME_PICKER_CONFIG -> InjectionToken NB_TIME_PICKER_CONFIG -> InjectionToken NB_TIME_PICKER_CONFIG]:
NullInjectorError: No provider for InjectionToken NB_TIME_PICKER_CONFIG!
import { NgModule } from '@angular/core';
import {
NbCardModule,
NbIconModule,
NbButtonGroupModule,
NbButtonModule,
NbInputModule,
NbDatepickerModule,
NbTimepickerModule } from '@nebular/theme';
import { ThemeModule } from '../../@theme/theme.module';
import { DeviceComponent } from './device.component';
import { RouterModule } from '@angular/router';
import { TopicService } from './topic_service';
@NgModule({
imports: [
RouterModule,
NbCardModule,
NbIconModule,
ThemeModule,
NbButtonGroupModule,
NbButtonModule,
NbInputModule,
NbDatepickerModule,
NbTimepickerModule
],
declarations: [
DeviceComponent,
],
providers: [
TopicService,
],
})
export class DeviceModule {
}
@kingsimba
If you are still having issues, within app.module.ts you need to add
".forRoot()"
to both NbDatePicker and NbTimePicker module imports.
@kingsimba
If you are still having issues, within app.module.ts you need to add
".forRoot()"
to both NbDatePicker and NbTimePicker module imports.
Thanks! This indeed solved the problem.
But can you teach me why some modules have forRoot()
while others have not(for example NbButtonModule?)
Issue type
I'm submitting a ... (check one with "x")
Issue description
Current behavior: Errors when using nb-date-timepicker component
Expected behavior: I cannot insert a date-time picker in the page. Single component date picker works but I get errors when I want also time.
Steps to reproduce: download last versione of nebular (6.2.1), open "datepicker.component.html" and add
<input nbInput placeholder="Pick Date" [nbDatepicker]="dateTimePicker"> <nb-date-timepicker withSeconds #dateTimePicker</nb-date-timepicker>
as shown on the documentationRelated code: https://stackblitz.com/edit/github-eqf4l6 (I am getting a different error here but I think this is useful for checking the evoirement)
Other information:
Node v12.16.0 npm: 6.14.8 macOS Catalina 10.15.7 Browser: Safari (irrelevant) Angular, Nebular
{ "name": "ngx-admin", "version": "6.0.0", "license": "MIT", "repository": { "type": "git", "url": "git+https://github.com/akveo/ngx-admin.git" }, "bugs": { "url": "https://github.com/akveo/ngx-admin/issues" }, "scripts": { "ng": "ng", "conventional-changelog": "conventional-changelog", "start": "ng serve", "build": "ng build", "build:prod": "npm run build -- --prod --aot", "test": "ng test", "test:coverage": "rimraf coverage && npm run test -- --code-coverage", "lint": "ng lint", "lint:fix": "ng lint ngx-admin-demo --fix", "lint:styles": "stylelint ./src/*/.scss", "lint:ci": "npm run lint && npm run lint:styles", "pree2e": "webdriver-manager update --standalone false --gecko false", "e2e": "ng e2e", "docs": "compodoc -p src/tsconfig.app.json -d docs", "docs:serve": "compodoc -p src/tsconfig.app.json -d docs -s", "prepush": "npm run lint:ci", "release:changelog": "npm run conventional-changelog -- -p angular -i CHANGELOG.md -s", "postinstall": "ngcc --properties es2015 es5 browser module main --first-only --create-ivy-entry-points --tsconfig \"./src/tsconfig.app.json\"" }, "dependencies": { "@akveo/ng2-completer": "^9.0.1", "@angular/animations": "^10.2.1", "@angular/cdk": "10.2.5", "@angular/common": "^10.2.1", "@angular/compiler": "^10.2.1", "@angular/core": "^10.2.1", "@angular/forms": "^10.2.1", "@angular/material": "^10.2.6", "@angular/platform-browser": "^10.2.1", "@angular/platform-browser-dynamic": "^10.2.1", "@angular/router": "^10.2.1", "@asymmetrik/ngx-leaflet": "3.0.1", "@fullcalendar/angular": "^5.3.1", "@fullcalendar/daygrid": "^5.3.2", "@fullcalendar/interaction": "^5.3.1", "@microsoft/signalr": "^3.1.9", "@nebular/auth": "^6.2.1", "@nebular/eva-icons": "6.2.1", "@nebular/security": "^6.2.1", "@nebular/theme": "^6.2.1", "@ngx-formly/bootstrap": "^5.10.5", "@ngx-formly/core": "^5.10.5", "@ngx-formly/schematics": "^5.10.5", "@swimlane/ngx-charts": "^14.0.0", "@types/chart.js": "^2.9.27", "angular-datatables": "^9.0.2", "angular2-chartjs": "0.4.1", "bootstrap": "^4.5.3", "chart.js": "^2.9.4", "chartjs-plugin-datalabels": "^0.7.0", "ckeditor": "4.7.3", "classlist.js": "1.1.20150312", "core-js": "2.5.1", "datatables.net": "^1.10.22", "datatables.net-dt": "^1.10.22", "echarts": "^4.9.0", "eva-icons": "^1.1.3", "intl": "1.2.5", "ionicons": "2.0.1", "jquery": "^3.5.1", "leaflet": "1.2.0", "nebular-icons": "1.1.0", "ng2-ckeditor": "^1.2.9", "ng2-smart-table": "^1.7.1", "ngx-echarts": "^4.2.2", "node-sass": "^4.14.1", "normalize.css": "6.0.0", "pace-js": "1.0.2", "roboto-fontface": "0.8.0", "rxjs": "6.6.3", "rxjs-compat": "6.3.0", "socicon": "3.0.5", "style-loader": "^1.3.0", "tinymce": "4.5.7", "tslib": "^2.0.3", "typeface-exo": "0.0.22", "web-animations-js": "^2.3.2", "zone.js": "~0.10.3" }, "devDependencies": { "@angular-devkit/build-angular": "^0.1002.0", "@angular/cli": "^10.2.0", "@angular/compiler-cli": "^10.2.1", "@angular/language-service": "10.1.6", "@compodoc/compodoc": "^1.1.11", "@fortawesome/fontawesome-free": "^5.15.1", "@types/d3-color": "1.0.5", "@types/datatables.net": "^1.10.19", "@types/jasmine": "2.5.54", "@types/jasminewd2": "2.0.3", "@types/jquery": "^3.5.4", "@types/leaflet": "1.2.3", "@types/node": "^12.19.3", "codelyzer": "^6.0.1", "conventional-changelog-cli": "1.3.4", "husky": "0.13.3", "jasmine-core": "~3.5.0", "jasmine-spec-reporter": "~5.0.0", "karma": "~5.0.0", "karma-chrome-launcher": "~3.1.0", "karma-cli": "1.0.1", "karma-coverage-istanbul-reporter": "~3.0.2", "karma-jasmine": "~3.3.0", "karma-jasmine-html-reporter": "^1.5.0", "npm-run-all": "4.0.2", "protractor": "~7.0.0", "rimraf": "2.6.1", "stylelint": "7.13.0", "ts-node": "3.2.2", "tslint": "~6.1.0", "tslint-language-service": "^0.9.9", "typescript": "3.9.7" } }