在模板中，我们将使用ng-bootstrap的ngbPopover和ngbDatepicker指令。ngbPopover指令使我们能够创建Popover内容，而ngbDatepicker指令使我们能够创建日期选择器。

首先，我们需要定义Popover的内容。在组件的模板中，我们将创建一个“datepicker”div，它将显示日期选择器：

在这里，我们定义了一个包含ngbPopover指令的div，它将Popover内容设置为“datepicker”字符串。我们还使用ngbDatepicker指令将日期选择器绑定到输入元素。

在选择日期时，我们希望Popover自动关闭。为此，我们将使用ngModelChange事件，该事件在ngModel的值发生更改时被触发。我们在日期选择器上定义了select事件，并调用了p.close()方法，它将关闭Popover。请注意，我们还在导航事件上调用了d.focus()方法，以便在Popover中导航时聚焦日期选择器。

最后，我们需要将selectedDate属性添加到组件中，以便我们可以在需要时访问所选日期。在组件的类中，我们定义了一个selectedDate属性，如下所示：

export class AppComponent {
  public selectedDate: NgbDateStruct;
  constructor() {
    this.selectedDate = { year: 2021, month: 1, day: 1 };
  }
}

在这里，我们使用Ngb