如何将 ng-bootstrap 与 AngularJS 2 一起使用(使用 angular-cli v1b15)?

2024-02-09

我一直在尝试按照 ng-bootstrap 官方网站上的文档在我的 Angular 2 项目中使用 ng-bootstrap 。

我所做的如下:

  1. npm install [email protected] /cdn-cgi/l/email-protection
  2. 导航到根 /bootstrap 目录并运行npm install安装 package.json 中列出的本地依赖项。
  3. 再次导航到根项目并运行npm install --save @ng-bootstrap/ng-bootstrap

之后,我按如下方式导入模块:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing } from './app.routing';

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


import { AppComponent } from './app.component';
import { PageModule } from "./page/page.module";

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

但是,我仍然无法在我的项目中使用引导样式,例如左拉。

有关信息,我将 angular-cli v1.0.0-beta.15 与 webpack 一起使用。

我该如何解决这个问题?


在装饰器的导入中,您需要像这样调用 ngBootstrap

NgbModule.forRoot()

示例应用程序模块

import { BrowserModule } from '@angular/platform-browser';
import { NgbModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule, Routes } from '@angular/router';
import { AppComponent } from './app.component';
import { routes } from './app.routes';

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

@NgModule({
  declarations: [
 AppComponent,
],
imports: [
  BrowserModule,
  FormsModule,
  HttpModule,
  RouterModule.forRoot(routes), 
  // Add This
  NgbModule.forRoot()
],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何将 ng-bootstrap 与 AngularJS 2 一起使用(使用 angular-cli v1b15)? 的相关文章

随机推荐