Question

在代码https://stackblitz.com/edit/angular-a9wcee

中

应用程序启动时，我正在显示一个Bootstrap对话框。但是单击关闭按钮后，对话框不会关闭。我在做什么错了？

在index.html中，我创建应用程序的根组件并传递一个在对话框中显示的属性

<my-app signup="startup message">loading </my-app>

在app.component.ts的{{1}}中，我读取属性并显示对话框（在调用ngAfterViewInit之后，因为我需要等待更改检测完成之前）

setTimeout

ngAfterViewChecked(){ this.signup = this.el.nativeElement.getAttribute('signup'); setTimeout(()=>this.isSignupProcess()); }有一个对话框组件

app.component.html

对话框组件是Hope to see dialog when the application starts! <button>Am I clickable</button> <app-dialog-box #dialogBox [dialogMessage]="" [dialogID]="'appDialog'" [context]=""></app-dialog-box>模态。

Bootstrap

对话框组件还具有显示和隐藏模式的功能。

<div class="modal" #modal tabindex="-1" role="dialog" id="someID">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Example</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>{{dialogMessage}}</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal" (click)="dialogHide()">Close</button>
      </div>
    </div>
  </div>
</div>

但是dialogShow(message:string,context:DialogContext){ this.context = context; this.dialogMessage = message; //console.log("dialog show called "); $(this.dialogRef.nativeElement).modal('show'); } dialogHide(){ // console.log("dialog hide called"); $(this.dialogRef.nativeElement).modal('hide'); } }不会隐藏模式。为什么？

引导对话框未在调用modal（'hide'）时关闭

0 个答案: