Javascript 如何访问ng模板中的元素？（五）

我使用库在程序中创建一个日期选择器。html文件如下所示：

<button class="btn btn-secondary" [ngbPopover]="popDate" popoverTitle="Date" placement="bottom">
    {{ my_date_string }}
</button>

<ng-template #popDate>
    <ngb-datepicker #popDatePicker [(ngModel)]="my_date_struct"></ngb-datepicker>
</ng-template>

但我得到了这个错误：

Cannot read property 'navigateTo' of undefined

如何解决此错误？当模板被实例化时，我必须以某种方式调用函数，但我不知道如何调用

---

编辑

---

我可以从

setTimeout

调用

click

事件处理程序中找到元素，但这似乎不是解决问题的好方法。

我可以猜，单击按钮时，popover尚未呈现。请尝试以下操作：

在标记中：

(click)="btnClick()"

在组件中：

constructor(private cd: ChangeDetectorRef) {}

btnClick(): void {
   setTimeout(() => { 
     this.popDatePicker.navigateTo();
     this.cd.markForCheck();
   });
}

---

它可以工作，但是这个

setTimeout

方法看起来并不优雅，我只是阅读了popover文档，我在那里看到了（显示的）事件。我假设它将在渲染组件后触发，所以您应该可以

constructor(private cd: ChangeDetectorRef) {}

btnClick(): void {
   setTimeout(() => { 
     this.popDatePicker.navigateTo();
     this.cd.markForCheck();
   });
}