Question

我尝试使用ng-bootstrap在我的Angular2项目中使用bootstrap。

按照他们的指示，我添加了bootstrap css文件，在我的systemJS配置中映射了@ ng-bootstrap，安装了ng-bootstrap并将他们的主模块添加到我的根模块：

import { NgModule }       from '@angular/core';
import { BrowserModule }  from '@angular/platform-browser';
import { FormsModule }    from '@angular/forms';

import { NgbModule }            from '@ng-bootstrap/ng-bootstrap';
import { AppComponent }         from './app.component';
import { HeaderComponent }      from './header/header.component';
import { AppRoutingModule }     from './app-routing.module';

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    AppRoutingModule,
    NgbModule.forRoot()
  ],
  declarations: [
    AppComponent,
    HeaderComponent
  ],
  providers: [ HeroService ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

但是当我尝试创建一个简单的消息板模板时，它并没有像预期的那样工作。当我离开Ngbmodule时，似乎没有任何改变。

奇怪的是，当我从bootstrap 4 css更改为bootstrap 3.3.6 css时，更多的工作正在按预期工作，但文本区域等简单的东西仍然没有被设计。

在安装ng-bootstrap期间我做错了什么？欢迎任何帮助。

更新

这是我使用的标记和输出示例：http://plnkr.co/edit/A9DySwR3PBNJShRFi27Q?p=preview

虽然这是我曾经使用相同代码在angular-1项目上实现的结果： http://prnt.sc/db9azv

Answer 1

您的问题似乎并不是https://ng-bootstrap.github.io项目特有的，而是仅针对Bootstrap的4 CSS。根据您的示例，我认为您的CSS类名称中只有一个拼写错误 - 它应该是form-control而不是 form control。

这是一个工作的掠夺者：http://plnkr.co/edit/hfvCwMistZdIWUlOAthM?p=preview

ng-bootstrap不工作（angular2）

1 个答案: