Angular / PrimeNg: Фокус на вводе каждый раз, когда я открываю p-диалог

Question

Я хотел бы автоматически сфокусировать определенное поле ввода, которое находится в компоненте p-диалога, который открывается / закрывается флагом, который привязан к атрибуту visible диалога.

Когда я добавляю атрибут «автофокус» к входному тегу - он фокусируется только при первом открытии диалога.

Когда я использую событие "onShow" - оно генерируется ДО открытия диалогового окна.

Когда я добавляю директиву «автофокус» и пытаюсь установить фокус в AfterViewInit - он вызывается только один раз.

Кто-нибудь знает, как я могу установить фокус или получить событие onAfterShow для диалога?

Answer 1

Я использую setTimeout, чтобы установить фокус элемента после определенной временной базы на внешний вид формы, например, 500 миллисекунд

шаблон

<p-dialog [header]="dialogTitle" [(visible)]="isDialogVisible" [responsive]="true" 
   [appendTo]="'body'" (onShow)="setFocus(txtElement)">
     <input #txtElement >
</p-dialog>

компонент

setFocus(elm: HTMLInputElement) {
    setTimeout(() => {
      elm.focus()
    }, 500);
  }