【发布时间】：2018-03-30 16:29:34
【问题描述】：
我正在尝试在我的 Angular 项目中实现 ngbd-carousel-basic。我现在只想把它放在 home.component 中。但是，这是我尝试遵循文档中的代码后得到的（尽管将文件从 html/ts 编辑为 .component.html 和 .component.ts）
所以，我是一个 Angular 菜鸟。所以也许我忘了包括一个步骤？以下是我到目前为止采取的步骤：
-
app.module.ts 内部：从我的文件路径导入 NgbdCarouselBasic。将其宣布为宣言。导入NgbModule，并在
@NgModule、import NgbModule.forRoot()内。
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
// Own components
import {NgbdCarouselBasic} from './shared/carousel/carousel-basic.component';
@NgModule({
declarations: [
AppComponent,
HomeComponent,
ViewAllRecordsComponent,
NgbdCarouselBasic
],
imports: [
BrowserModule,
AppRoutingModule,
FormsModule,
HttpClientModule,
TableModule,
NgbModule.forRoot()
],
providers: [
TimeService
],
bootstrap: [AppComponent]
})
export class AppModule { }
- 在 home.component.html 内：
<ngbd-carousel-basic></ngbd-carousel-basic>
这是我的依赖项。也许有些东西不兼容，我没有意识到？
"dependencies": {
"@angular/animations": "^5.2.0",
"@angular/common": "^5.2.0",
"@angular/compiler": "^5.2.0",
"@angular/core": "^5.2.0",
"@angular/forms": "^5.2.0",
"@angular/http": "^5.2.0",
"@angular/platform-browser": "^5.2.0",
"@angular/platform-browser-dynamic": "^5.2.0",
"@angular/router": "^5.2.0",
"@ng-bootstrap/ng-bootstrap": "^1.0.4",
"bootstrap": "^3.3.7",
"core-js": "^2.4.1",
"font-awesome": "^4.7.0",
"jquery": "^3.3.1",
"postcss": "^6.0.21",
"primeng": "^5.2.4",
"rxjs": "^5.5.6",
"tether": "^1.4.3",
"webpack": "^3.11.0",
"zone.js": "^0.8.19"
},
【问题讨论】：
-
你在哪里提供了图片来源？试着把你的html代码也放上
-
您需要升级到 Bootstrap 4 才能使用ng-bootstrap。根据您的依赖关系，您现在使用的是 Bootstrap 3.3.7。
-
@ConnorsFan 啊，是的，ng-bootstrap 确实需要 Bootstrap 4。但是，我遇到了这个问题：stackoverflow.com/questions/48735689/… 因此我降级了......看起来我需要另一种方法来拥有两个导航栏然后轮播？
-
原来我把an answer 给了另一个问题。你试过了吗？
-
最终只使用 ngx-bootstrap 而不是 ng-bootstrap 并且效果很好，因为它同时支持 Bootstrap 3 和 Bootstrap 4。还没有尝试过你的解决方案 atm ：/ 至少我的问题得到了解决现在。 @ConnorsFan
标签： javascript angular twitter-bootstrap ng-bootstrap