typescript 使用 PrimeNG 日历检测 [(ngmodel) 对选定日期的更改
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/38569493/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Detect [(ngmodel) change to selected date with PrimeNG calendar
提问by Buzzer
I have an input element with an attached datepicker created using PrimeNG calendar.
我有一个带有使用 PrimeNG 日历创建的附加日期选择器的输入元素。
HTML Part
HTML 部分
<p-calendar showAnim="slideDown"
id="calendar"
[showIcon]="true
[(ngModel)]="myDate"
(blur)="onBlurMethod($event)">
</p-calendar>
Here I have used PrimeNG calendar tag. I have used one hidden text box so I can pick the updated value but it is reflecting in the text box. How can I capture the updated value on any event ?
这里我使用了 PrimeNG 日历标签。我使用了一个隐藏的文本框,所以我可以选择更新的值,但它反映在文本框中。如何捕获任何事件的更新值?
<input type="hidden" id = "datePickerText" [ngModel]="myDate">
When the user changes the date by typing directly into the input element, I can get the value with the input element's blur event, as shown above. But when the user changes the date from datepicker (i.e. by clicking a date on the calendar), the blur handler is not called.
当用户通过直接在 input 元素中键入来更改日期时,我可以通过 input 元素的模糊事件获取值,如上所示。但是当用户从日期选择器更改日期(即通过单击日历上的日期)时,不会调用模糊处理程序。
How can I detect changes to the selected date that are made via the datepicker
, rather than by typing into the input element ?
如何检测通过datepicker
而不是通过在输入元素中键入对所选日期所做的更改?
回答by rinukkusu
The PrimeNG calendarhas two events you can use: onBlur
and onSelect
.
该PrimeNG日历有可以使用两个事件:onBlur
和onSelect
。
So you probably want to change your code to use onBlur
instead of blur
:
所以你可能想改变你的代码来使用onBlur
而不是blur
:
<p-calendar showAnim="slideDown"
id="calendar"
[showIcon]="true"
[(ngModel)]="myDate"
(onBlur)="onBlurMethod($event)">
</p-calendar>
回答by gourab
you can use (ngModelChange)="yourMethod()"
.
你可以使用(ngModelChange)="yourMethod()"
.
回答by Simon_Weaver
Another approach can be to use get
and set
properties to detect a change directly.
另一种方法可以是使用get
和set
属性来直接检测更改。
private _startDate: Date;
set startDate(date: Date)
{
this._startDate = date;
alert('changed');
}
get startDate(): Date
{
return this._startDate;
}
Whichever way you choose you'll need to make sure you know when the logic is being triggered - and that it isn't being ran unnecessarily. This way may get cumbersome and have separation of concern issues and is probably not advisable if you have to make a remote call as a result of the trigger.
无论您选择哪种方式,您都需要确保知道何时触发逻辑 - 并且不会不必要地运行它。这种方式可能会变得很麻烦并且存在关注点分离的问题,如果您因触发而必须进行远程调用,则可能不建议这样做。