Topic: Angular 11 Sidenav not working

KBi priority asked 2 years ago

Expected behavior Showing example Sidenav referenced to the docs

Actual behavior src/app/app.component.html:23:3 - error NG8001: 'mdb-sidenav-layout' is not a known element: 1. If 'mdb-sidenav-layout' is an Angular component, then verify that it is part of this module. 2. If 'mdb-sidenav-layout' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.


Resources (screenshots, code snippets etc.) Installed via


{ "name": "ui", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "~11.2.6", "@angular/cdk": "^11.0.0", "@angular/common": "~11.2.6", "@angular/compiler": "~11.2.6", "@angular/core": "~11.2.6", "@angular/forms": "~11.2.6", "@angular/platform-browser": "~11.2.6", "@angular/platform-browser-dynamic": "~11.2.6", "@angular/router": "~11.2.6", "@fortawesome/fontawesome-free": "^5.15.1", "mdb-angular-ui-kit": "^1.0.0-beta3", "ng-uikit-pro-standard": "git+", "rxjs": "~6.6.0", "tslib": "^2.0.0", "zone.js": "~0.11.3" }, "devDependencies": { "@angular-devkit/build-angular": "~0.1102.5", "@angular/cli": "~11.2.5", "@angular/compiler-cli": "~11.2.6", "@types/jasmine": "~3.6.0", "@types/node": "^12.11.1", "codelyzer": "^6.0.0", "jasmine-core": "~3.6.0", "jasmine-spec-reporter": "~5.0.0", "karma": "~6.1.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.0.3", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.5.0", "protractor": "~7.0.0", "ts-node": "~8.3.0", "tslint": "~6.1.0", "typescript": "~4.1.5" } }

Thanks for your help!

Arkadiusz Idzikowski staff commented 2 years ago

@KBi did you import MdbSidenavModule or MdbModule in your module file?

In case of any further problems, please try to reinstall your dependencies (remove node_modules and package-lock.json and run npm install command again) and try to run application again with ng serve.

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • User: Priority
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: 11.0.0
  • Device: PC
  • Browser: Chrome/
  • OS: Windows 10 Pro
  • Provided sample code: No
  • Provided link: Yes