Question

将NgbModule导入app.module.ts时，出现以下错误：

    at ng-bootstrap.js:146
    at Module../node_modules/@ng-bootstrap/ng-bootstrap/fesm5/ng-bootstrap.js (ng-bootstrap.js:148)
    at __webpack_require__ (bootstrap:78)
    at Module../src/app/app.module.ts (app.component.ts:8)
    at __webpack_require__ (bootstrap:78)
    at Module../src/main.ts (main.ts:1)
    at __webpack_require__ (bootstrap:78)
    at Object.0 (main.ts:12)
    at __webpack_require__ (bootstrap:78)
    at checkDeferredModules (bootstrap:45)

我在代码中的任何地方都没有使用过它，只将其包含在package.json中，并将其导入到app.module.ts中。

我在另一篇文章中看到，当他们有类似的错误时，是因为他们使用了不正确的ngbootstrap版本以及angular和bootstrap，所以我更改了版本但没有更改。我还在导入中尝试了NgbModule.forRoot（），但没有帮助。

这是我package.json的一部分：

  "dependencies": {
    "@angular/animations": "~7.2.0",
    "@angular/common": "~7.2.0",
    "@angular/compiler": "~7.2.0",
    "@angular/core": "~7.2.0",
    "@angular/forms": "~7.2.0",
    "@angular/platform-browser": "~7.2.0",
    "@angular/platform-browser-dynamic": "~7.2.0",
    "@angular/router": "~7.2.0",
    "bootstrap": "^4.0.0",    
    "@ng-bootstrap/ng-bootstrap": "^4.1.1",
    "core-js": "^2.5.4",
    "rxjs": "~6.3.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.13.0",
    "@angular/cli": "~7.3.9",
    "@angular/compiler-cli": "~7.2.0",
    "@angular/language-service": "~7.2.0",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.0.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.2.2"
  }

这是我的app.module.ts：

import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { AppNavbarComponent } from './app-navbar/app-navbar.component';

import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

@NgModule({
  declarations: [
    AppComponent,
    AppNavbarComponent
  ],
  imports: [
    BrowserModule, 
    NgbModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

如果我可以使用它，我正在尝试实现NgBoostrap下拉组件，谢谢您的帮助！

Answer 1

我已解决此问题，如前所述，我在package.json中更改了当前版本的bootstrap和ng-bootstrap，但这没有用。所以我用

卸载了ng-bootstrap

npm uninstall @ng-bootstrap/ng-bootstrap --save

并安装具有以下内容的版本4：

npm install --save @ng-bootstrap/ng-bootstrap@4

重新加载页面，一切正常！

如何修复错误“未捕获的TypeError：Object（...）不是函数”

1 个答案: