Question

我的项目中存在角材对话框的问题，当我打开对话框时，它会自动向下滚动到底部，当我关闭对话框时，它会滚动回到原始位置，然后再打开它。

我试图：

在我的对话框配置中添加autoFocus: false
在我的app.module.ts文件中将BrowserAnimationModule更改为NoopAnimationModule
在对话框内容的按钮标签中添加tabindex="-1"

但没有任何效果，我使用了没有任何JS文件的自定义CSS主题，我只使用材质来使用对话框。

这是我的代码：

public openAddLinkDialog(): void {
   this.dialog.open(AddLinkComponent).afterClosed().subscribe(data => {
      if (data) {
        console.log(data);
      }
   });
}

<div class="modal modal-right fade show" style="display: block;">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Ajouter un lien</h5>
        <button type="button" class="close" (click)="closeDialog()">
          <span aria-hidden="true">×</span>
        </button>
      </div>
      <div class="modal-body ps-container ps-theme-default">
        <p>Test</p>
      </div>
      <div class="modal-footer modal-footer-uniform">
        <button type="button" class="btn btn-bold btn-pure btn-secondary" (click)="closeDialog()">
          Fermer
        </button>
        <button type="button" class="btn btn-bold btn-pure btn-primary" [disabled]="form.invalid" (click)="addLink()">
          Ajouter
        </button>
      </div>
    </div>
  </div>
</div>
<div class="modal-backdrop fade show"></div>

Answer 1

使用设置autoFocus: false打开窗口时添加配置对象例如，在这里： const dialogRef = this.dialog.open( SomeComponent, { autoFocus: false }); 否则，窗口将滚动到第一个可聚焦元素，即您的按钮

角度-打开角度对话框时自动向下滚动到底部

1 个答案: