当内容宽度扩展时，如何以编程方式更新的PrimeNG对话框

Question

此处是PrimeNG / Angular的新功能。我们有一个元素，它首先作为一个很小的窗口打开。用户可以单击链接来展开对话框。展开后，宽度会向右扩展，但对话框将保持其首次打开时的位置。

我知道应该有一个dialog center（）方法，但是我不知道如何连接它。谢谢！

Answer 1

以此为灵感使它起作用：PrimeNG p-dialog positionTop

基本上，我在ui-dialog元素本身以及一些内部元素上设置了一个“扩展”类，然后以编程方式设置了左侧位置。

private centerDialog() {
    const dialogElement = <HTMLElement>document.querySelector('.ui-dialog');

    if (!dialogElement) {
      setTimeout(() => {
        this.centerDialog();
      }, 100);
    } else {
      this.toggleExpandedClass();
      dialogElement.style.left =
        window.innerWidth / 2 - dialogElement.clientWidth / 2 + 'px';
    }
  }