剣道角度のDatePickerの最終的なValueChangeイベントを特定するには

Question

剣道角度DatePickerの最小値と最大値を設定する必要があります。これはかなり正直で[(max)]="maxDate" and [(min)]="minDate"を使用しており、これはマウスを使用してDatePickerをクリックすると機能します。

キーボードの入力を使用すると、ユーザーは最小および最大の日付以外の日付を選択できます。私はvalueChangeイベントを持っていますが、すべてのキーストロークで起動します。私は、ユーザーが日付全体を入力し終わった時点を決定し、必要に応じて単に日付をminまたはmaxに設定することはできません。私は次のコントロールのonFocusイベントを設定することができますが、それはクルージングです。

これは、HTMLコードの抜粋です：

<kendo-datepicker 
    id="dpFirstPaymentDate" 
    (valueChange)="onFirstPaymentDateChange($event)" 
    [(value)]="firstPaymentDate" 
    [(max)]="maxDate" 
    [(min)]="minDate" 
    [(focusedDate)]="firstPaymentDate" 
    [rangeValidation] = "true" 
    title="First Payment Date"> 
    </kendo-datepicker> 

角度コードはこれです：

protected onFirstPaymentDateChange(/*event: EventEmitter*/ value: Date): void { 

     if (value > this.maxDate) { 
      // This does not appear to be working 
      value = new Date(this.maxDate); 
      this.firstPaymentDate = new Date(this.maxDate); 
     } 
     else if (value < this.minDate) { 
      value = new Date(this.minDate); 
      this.firstPaymentDate = new Date(this.minDate); 
     } 

     this.maturityDate = new Date(value); 
     this.maturityDate.setMonth(value.getMonth() + this.term); 


    } 

完全plunkerの例はここにある：Plunker example

Answer 1

わかりました、私のコメントがあるので、実際にポイント上にあるので、実際にonchangeイベントを使用する代わりに、on blurイベントを使用する必要があります。

<kendo-datepicker 
    id="dpFirstPaymentDate" 
    (blur)="onFirstPaymentDateChange($event)" 
    [(value)]="firstPaymentDate" 
    [(max)]="maxDate" 
    [(min)]="minDate" 
    [(focusedDate)]="firstPaymentDate" 
    [rangeValidation] = "true" 
    title="First Payment Date"> 
</kendo-datepicker> 

日付の値が得られていないので、onFirstPaymentDateChange関数のちょっとした変更は、this.firstPaymentDateで取得するだけで、ロジック（最大値）を設定し続けることができます。ここに実例がありますplnkr