Javascript 模态不'；t正确显示角度4

我正在使用ng bootstrap尝试做一个模态示例，但是当我单击open modal时，它并没有出现，尽管它存在于DOM中

我的angular core版本：4.0.0，@ng bootstrap/ng bootstrap:1.0.0-alpha.29，bootstrap:3.3.7

test-modal.component.html

<div class="modal-header">
      <h4 class="modal-title">Hi there!</h4>
      <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
      <p>Hello, {{name}}!</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-secondary" (click)="activeModal.close('Close click')">Close</button>
    </div>

<button class="btn btn-lg btn-outline-primary" (click)="open()">Launch demo modal</button>

使用构造函数在app.component.ts中打开函数

 constructor(private modalService: NgbModal) {}
  open() {
    const modalRef = this.modalService.open(TestModalComponent);
  }

app.component.html中的按钮

<div class="modal-header">
      <h4 class="modal-title">Hi there!</h4>
      <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
      <p>Hello, {{name}}!</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-secondary" (click)="activeModal.close('Close click')">Close</button>
    </div>

<button class="btn btn-lg btn-outline-primary" (click)="open()">Launch demo modal</button>

启动演示模式

我想问题可能在于您的引导版本

引导：3.3.7

，当我到达主页时，它说这是为引导4准备的（在get started上还说是引导4）

在这里的Angular 4+Bootstrap 4项目中进行测试，我让它工作了

在

package.json中

"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.29",
"bootstrap": "^4.0.0-alpha.6",

在我的模块中

imports: [
  NgbModule.forRoot(), ...
],
entryComponents: [ModalTemplateComponent],

在组件中：

modal: NgbModalRef;

constructor(private modalService: NgbModal) { }  

async open() {
  this.modal = this.modalService.open(ModalTemplateComponent);

  const result = await this.modal.result;

  console.log(result);
}

请发布您正在使用的代码片段，或提供一个。您可以阅读更多关于：）@0mpurdy我共享了相关代码，请参阅更新。可能会对您有所帮助-请注意，它提到：您是否忘记将引导css附加到您的应用程序？@0mpurdy感谢您的回复，我在样式部分的
.angular cli.json
文件中添加了引导css您在控制台中看到任何错误吗？很好，就是这样：D