angularjs – ng-bootstrap ngbDropdown无法在角度4中工作

我为这种情况安装了以下npm模块：

“@ ng-bootstrap / ng-bootstrap”：“^ 1.0.0-alpha.22”,
?“bootstrap”：“4.0.0-alpha.6”,
?“bootstrap-sass”：“^ 3.3.7”,

我的app.module.ts看起来像这样：

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

import { AppComponent } from "./app.component";
import { FileitHeaderComponent } from "./fileit-header/fileit-header.component";
import {TranslateModule} from "ng2-translate";
import { CCACampaignComponent } from "./cca-campaign/cca-campaign.component";
import {NgbModule} from "@ng-bootstrap/ng-bootstrap";


@NgModule({
  declarations: [
    AppComponent,FileitHeaderComponent,CCACampaignComponent
  ],imports: [
    BrowserModule,FormsModule,HttpModule,TranslateModule.forRoot(),NgbModule.forRoot()
  ],providers: [],bootstrap: [AppComponent]
})
export class AppModule { }

在CCA Campaign中我试图使用ng-bootstrap的演示：

<div ngbDropdown class="d-inline-block">
    <button class="btn btn-outline-primary" id="dropdownMenu1" ngbDropdownToggle>Toggle dropdown</button>
        <div class="dropdown-menu" aria-labelledby="dropdownMenu1">
            <button class="dropdown-item">Action - 1</button>
            <button class="dropdown-item">Another Action</button>
            <button class="dropdown-item">Something else is here</button>
        </div>
</div>

但遗憾的是,这段代码的结果非常糟糕：

当我点击它时没有任何反应……