如何在输入字段的ng-bootstrap Datepicker中检测日期选择？ [英] How to detect date selection in ng-bootstrap Datepicker on input field?

问题描述

我们将 ng-bootstrap Datepicker用作指令我们的项目：

<input class="form-control"
         name="dp" ngbDatepicker #d="ngbDatepicker" (blur)="d.close()" [(ngModel)]="model"
         (ngModelChange)="onDateSelected()">

当前行为是 onDateSelected（） 在选择日期选择器中的日期以及每次更改输入字段时都会调用。

The current behaviour is that onDateSelected() is called when a date in the datepicker is selected, as well as every time a change is made to the input field.

>所需的行为是，只要用户单击日期选择器中的日期或将光标移出，就会调用 onDateSelected（） < input> （即模糊）。

The desired behaviour is that onDateSelected() is called whenever the user clicks on a date in the datepicker or moves the cursor out of the <input> (i.e. blur).

我的方法是更改​​（ngModelChange）到（模糊）：

My approach was to change (ngModelChange) to (blur):

<input class="form-control"
         name="dp" ngbDatepicker #d="ngbDatepicker" (blur)="d.close(); onDateSelected()"
         [(ngModel)]="model">

但这会导致 onDateSelected（） <从日期选择器中选择一个日期时，将调用em> not -这有点有意义，因为光标不在< input> 内。但是，在搜索 dateSelected -Event / api＃NgbInputDatepicker rel = noreferrer> ng-bootstrap文档，我可以在其上调用 onDateSelected（）：

but this leads to onDateSelected() not being called, when a date is selected from the datepicker - which kinda makes sense, because the cursor is not inside the <input>. However, I could not find some sort of dateSelected-Event when searching the ng-bootstrap docs on which I could call onDateSelected():

<input class="form-control"
         name="dp" ngbDatepicker #d="ngbDatepicker" (blur)="d.close(); onDateSelected()"
/* missing -> */ (dateSelected)="onDateSelected()" /* <- */ [(ngModel)]="model">

有什么我想念的吗？也许是实现此行为的另一种方法？我想不出是唯一有此要求的人...

Is there something I miss? Or maybe another way to implement this behaviour? I can't think of being the only one with this requirement...

推荐答案

同时，问题已关闭，并且在1.1.0版本中将发生（dateSelect）事件： https://github.com/ng-bootstrap/ng-bootstrap/pull/2254

Meanwhile, the issue has been closed and there will be a (dateSelect) event in 1.1.0: https://github.com/ng-bootstrap/ng-bootstrap/pull/2254

这篇关于如何在输入字段的ng-bootstrap Datepicker中检测日期选择？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！