ngx bootstrap - 将输入焦点放在模态打开上

如何解决ngx bootstrap - 将输入焦点放在模态打开上

我有一个带有输入文本字段的模式，当我打开模式时，我想聚焦输入（因此用户无需选择框即可直接输入）。

我阅读了几种使用 ngx-bootstrap 执行此操作的不同方法。我已经尝试了很多，但它们似乎都不起作用。然而最接近的是这个。所以下面的代码突出显示了该字段，但没有选择它。

模态上的输入字段：

<input autocomplete="off" list="autocompleteOff" type="text" class="text-input" id="childName" [(ngModel)]="childName" placeholder="Child's First Name" [autofocus]>

打开模型的代码（附加到按钮（点击）事件）：

// Open Create Child Modal
openModal(template: TemplateRef<any>) {
    this.clearChildData();
    this.modalRef = this.modalService.show(template);
    this.modalService.onShown.pipe( tap(() => (document.querySelector('[autofocus]') as HTMLElement).focus()) ).subscribe();
}

我看过这个工作的演示，所以很明显我遗漏了一些东西或者我错了，但不确定那是什么？