角度找不到模块'./dropdown-basic'.ts(2307)

时间:2020-04-09 20:41:46

标签: angular bootstrap-4 angular-ui-bootstrap dropdown

我试图将Bootstrap DropDown添加到我的有角项目中。当我尝试将Bootstrap DropDown导入到app.module.ts文件时;通过添加以下代码行

import { NgbdDropdownBasic } from './dropdown-basic';

我遇到了错误。

找不到模块'./dropdown-basic'.ts(2307)

我试图通过删除node_modules并重新安装它们来解决此问题,但是问题仍然存在。请检查package.json。我可以手动安装该软件包吗?

package.json

{
    "name": "lbd-free-angular-cli",
    "version": "1.6.0",
    "license": "MIT",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "test": "ng test",
        "lint": "ng lint",
        "e2e": "ng e2e",
        "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm start"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "9.0.6",
        "@angular/common": "9.0.6",
        "@angular/compiler": "9.0.6",
        "@angular/core": "9.0.6",
        "@angular/forms": "9.0.6",
        "@angular/localize": "^9.1.1",
        "@angular/platform-browser": "9.0.6",
        "@angular/platform-browser-dynamic": "9.0.6",
        "@angular/router": "9.0.6",
        "@ng-bootstrap/ng-bootstrap": "^6.0.2",
        "@ngui/map": "0.30.3",
        "@types/googlemaps": "3.39.3",
        "animate.css": "3.7.0",
        "arrive": "2.4.1",
        "bootstrap": "3.3.7",
        "bootstrap-notify": "3.1.3",
        "chartist": "0.11.0",
        "core-js": "2.6.9",
        "googleapis": "33.0.0",
        "jquery": "3.4.1",
        "perfect-scrollbar": "1.4.0",
        "rxjs": "6.5.4",
        "rxjs-compat": "6.5.4",
        "zone.js": "0.10.2"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "0.900.6",
        "@angular/cli": "9.0.6",
        "@angular/compiler-cli": "9.0.6",
        "@types/jasmine": "3.5.9",
        "@types/node": "13.9.0",
        "codelyzer": "5.2.1",
        "jasmine-core": "3.5.0",
        "jasmine-spec-reporter": "4.2.1",
        "karma": "4.4.1",
        "karma-chrome-launcher": "3.1.0",
        "karma-cli": "2.0.0",
        "karma-jasmine": "3.1.1",
        "karma-jasmine-html-reporter": "1.5.2",
        "karma-coverage-istanbul-reporter": "2.1.1",
        "protractor": "5.4.3",
        "ts-node": "8.6.2",
        "tslint": "6.1.0",
        "typescript": "3.7.5"
    }
}

app.module.ts

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { RouterModule } from '@angular/router';
import { AppRoutingModule } from './app.routing';
import { NavbarModule } from './shared/navbar/navbar.module';
import { FooterModule } from './shared/footer/footer.module';
import { SidebarModule } from './sidebar/sidebar.module';
import { AppComponent } from './app.component';
import { AdminLayoutComponent } from './layouts/admin-layout/admin-layout.component';
import { BrowserModule } from '@angular/platform-browser';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { NgbdDropdownBasic } from './dropdown-basic';

@NgModule({
  imports: [
    BrowserAnimationsModule,
    FormsModule,
    RouterModule,
    HttpClientModule,
    NavbarModule,
    FooterModule,
    SidebarModule,
    AppRoutingModule,
    BrowserModule,
    NgbModule
  ],
  declarations: [
    AppComponent,
    AdminLayoutComponent
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

输出

enter image description here

1 个答案:

答案 0 :(得分:1)

从'./dropdown-basic'导入{NgbdDropdownBasic};

这是错误的导入,我认为您正在遵循文档,并且您认为这对下拉列表来说是重要的导入,但并非如此。

如果您已将其导入到模块中

从'@ ng-bootstrap / ng-bootstrap'导入{NgbModule};

那你很好。检查一下我如何使用下拉模块: https://stackblitz.com/edit/ngbd-dropdown-module