簡體   English   中英

舊值保留在 ngModel 更改上

[英]Old value kept on ngModel change

處理需要按數據過濾的表,我創建了以下屏幕:

在此處輸入圖片說明

我需要的是刪除過濾器的日期開始條件之外的值,所以我已經在我的EsightComponent上完成了這個:

startDateChange($event, dt, col) {
  this.loading = true;
  this.eSightEndSubscription = this.eSightService.getByContractId(this.contractId).subscribe(
    res => {
      const filterResults = this.reads.filter((read) => {
        const iteratorDate = new Date(20 + read.timestamp.slice(-2), read.timestamp.slice(0, 2) - 1, 1);
        console.log(this.startDateFilter);
        return iteratorDate <= this.startDateFilter;
      }, this);

      this.processRightAnswer(filterResults);
    },
    error => {
      console.log('ERROR');
    },
    () => {
      this.loading = false;
    });
}

這是我的觀點:

<h4>Lecturas eSight <small>contrato {{ contractId }}</small></h4>

<p-calendar dateFormat="mm/yy" [(ngModel)]="startDateFilter" (onBlur)="startDateChange($event, dt, col)"></p-calendar>
<p-calendar [(ngModel)]="endDateFilter" (change)="startDateChange($event, dt, col)"></p-calendar>

<p-dataTable [value]="reads" [rows]="30" [paginator]="true" [loading]="loading" selectionMode="single" scrollable="true" #dt>
  <ng-container *ngFor="let col of cols; let i = index;">
    <p-column [field]="col.field" [header]="col.header" *ngIf="i === 0" [style]="{ 'width': '170px' }">
    </p-column>
    <p-column [field]="col.field" [header]="col.header" *ngIf="col.header.length <= 10" [style]="{ 'width': '55px' }"></p-column>
    <p-column [field]="col.field" [header]="col.header" *ngIf="col.header.length > 10" [style]="{ 'width': '170px' }"></p-column>
  </ng-container>
</p-dataTable>

<button class="btn btn-warning" (click)="onReturn()">Atrás</button>

基於tho way數據綁定原則, this.startDateFilter應該捕捉它的變化,但它沒有。 如果我在日歷上選擇一個日期,它總是顯示以前的值,而不是選擇的新值。 這可以在console.log(this.startDateFilter)行上看到。

我已經檢查過我可以使用ngOnChanges來捕獲更改並訪問舊值和新值,但是這個鈎子只適用於@Input()值,這不是我的情況。

我希望檢索用戶選擇的值而不是舊值。

謝謝。

發生這種情況是因為 ngModel 在更改日期后觸發,但您正在觀察模糊,在檢測之前觸發

您應該從 $event 中獲取當前值,而不是從模型值中獲取。 東西線

$event.value

基於 DmitriyKhirniy 的回答(非常感謝!!!),最終有效的是:

$event.target.value

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM