Обнаружить [(ngmodel) изменение на выбранную дату с помощью карандаша primeng

Question

У меня есть элемент ввода с прикрепленным фидером даты, созданным с помощью ngprime datepicker.

HTML Часть

<p-calendar showAnim="slideDown" 
      id="calendar" 
      [showIcon]="true 
      [(ngModel)]="myDate" 
      (blur)="onBlurMethod($event)"> 
</p-calendar> 

Здесь я использовал primeng Datepicker тег. Я использовал одно скрытое текстовое поле. Поэтому я могу выбрать обновленное значение, но оно отражается в текстовом поле, но как я могу захватить обновленное значение для любого события.

<input type="hidden" id = "datePickerText" [ngModel]="myDate"> 

Когда пользователь изменяет дату, введя непосредственно в элемент ввода, можно получить значение с событием размытия входного элемента, как показано выше. Но когда пользователь меняет дату с datepicker (т. Е. Нажав на дату в календаре), обработчик размытия не вызывается.

Как определить изменения выбранной даты, которые были сделаны с помощью datepicker, а не путем ввода ввода в элемент ввода?

Answer 1

PrimeNG calendar имеет два события, которые вы можете использовать: onBlur и onSelect.

Таким образом, вы, вероятно, хотите, чтобы изменить код, чтобы использовать onBlur вместо blur:

<p-calendar showAnim="slideDown" 
      id="calendar" 
      [showIcon]="true" 
      [(ngModel)]="myDate" 
      (onBlur)="onBlurMethod($event)"> 
</p-calendar> 

Answer 2

Другой подход может заключаться в использовании get и set свойства для обнаружения изменения непосредственно.

private _startDate: Date; 

set startDate(date: Date) 
{ 
    this._startDate = date; 
    alert('changed'); 
} 

get startDate(): Date 
{ 
    return this._startDate; 
} 

Какой бы путь вы выбираете вы должны убедиться, что вы знаете, когда логика в настоящее время срабатывает - и что он не бежал излишне. Этот способ может стать громоздким и разделять проблемы с беспокойством и, вероятно, не рекомендуется, если вам нужно сделать удаленный вызов в результате запуска.

Answer 3

вы можете использовать (ngModelChange)="yourMethod()".