Angular 单击按钮时将日期从Html传递到Ts

我有一个Html页面中的两个日期，我想在点击按钮时将其传递到后端，并与其他参数一起传递。这就是我现在所拥有的

    <input [owlDateTime]="dt1" placeholder="From a date" [value]="dateFrom.value">
    <span [owlDateTimeTrigger]="dt1"><i class="fa fa-calendar"></i></span>
    <owl-date-time #dt1></owl-date-time>


    <input [owlDateTime]="dt2" placeholder="To a date" [value]="dateTo.value">
    <span [owlDateTimeTrigger]="dt2"><i class="fa fa-calendar"></i></span>
    <owl-date-time #dt2></owl-date-time>


    <button class="startButton" mat-raised-button color="primary"
       (click)="loadData(81,topSelect.value,txtFilter.value,dt1.getValidDate,dt2.getValidDate)">
      Search
      <i class="fa fa-search pb-icon" aria-hidden="true"></i>
    </button>

以下是Ts文件：

  public loadData(customerId: number, topResult: number, searchTxt?: string, dateFrom?: Date, dateTo?: Date) {
    this.interfaceService.getLogsForCustomer(customerId, topResult, searchTxt, dateFrom, dateTo).subscribe((logs: Log[]) => {
      this.logs = logs;
      this.dataSource = new MatTableDataSource<Log>(this.logs);
      this.dataSource.paginator = this.paginator;
      this.dataSource.sort = this.sort;
      this.sort.sortChange.subscribe(() => this.paginator.pageIndex = 0);
    });
  }

---

添加一个表单标签。你应该使用

模板驱动表单 或

反应形式。 当您使用其中一个时，当用户输入完成时，您将得到验证和大量帮助UTIL

---

如果你不想使用表单。您可以使用ngModel。双向绑定[ngModel]将更新“后端”中的值，而无需按按钮添加表单标记。你应该使用

模板驱动表单 或

反应形式。 当您使用其中一个时，当用户输入完成时，您将得到验证和大量帮助UTIL

如果你不想使用表单。您可以使用ngModel。双向绑定[ngModel]将更新“后端”中的值，而无需按下按钮