角度日期范围输入火灾变化

Question

我有问题，因为我不知道如何在有人选择日期后触发更改事件。

\n

我当前的代码：

\n

<div class="d-flex align-items-center">\n    <mat-form-field appearance="fill">\n      <mat-label>Wybierz przedzia\xc5\x82 czasowy\n      </mat-label>\n      <mat-date-range-input [formGroup]="range" [rangePicker]="picker">\n        <input matStartDate formControlName="start" placeholder="Data pocz\xc4\x85tkowa">\n        <input matEndDate formControlName="end" placeholder="Data ko\xc5\x84cowa">\n      </mat-date-range-input>\n      <mat-datepicker-toggle matSuffix [for]=" picker"></mat-datepicker-toggle>\n      <mat-date-range-picker #picker></mat-date-range-picker>\n\n      <mat-error *ngIf="range.controls.start.hasError('matStartDateInvalid')">Z\xc5\x82a data pocz\xc4\x85tkowa</mat-error>\n      <mat-error *ngIf="range.controls.end.hasError('matEndDateInvalid')">Z\xc5\x82a data ko\xc5\x84cowa</mat-error>\n    </mat-form-field>\n  </div>\n

\n

Answer 1

你可以通过不同的方式知道何时发生变化

在每个输入中使用(dataChange) 或 (dateInput)：

<mat-date-range-input [formGroup]="range" [rangePicker]="picker">
    <input matStartDate formControlName="start" placeholder="Start date" (dateChange)="startChange($event)">
    <input matEndDate formControlName="end" placeholder="End date" (dateChange)="endChange($event)">
</mat-date-range-input>


startChange(event:MatDatepickerInputEvent)
  {
   console.log("startChange",event.value)
  }
  endChange(event:MatDatepickerInputEvent)
  {
   console.log("endChange",event.value)
  }

订阅 FormGroup/FormControl 的 valueChanges。例如在 ngOnInit 中

ngOnInit()
  {
    this.range.get('start').valueChanges.subscribe(res=>{
      console.log("valueChange start",res)
    })
    this.range.get('end').valueChanges.subscribe(res=>{
      console.log("valueChange end",res)
    })
    this.range.valueChanges.subscribe(res=>{
      console.log("range Change",res)
    })
  }