Angular 角度4+；-如何从输入日期选择器获取日期

我是新手

我有一个输入日期选择器。我想获取/获取在日期选择器中选择的日期

代码：Html文件：

 <input class="form-control m-input " id="m_datepicker_2_validate" placeholder="Select Date" readonly="" type="text">

在我添加的html中

 <input [ngModel]="staff_book_date | date:'yyyy-MM-dd'" class="form-control m-input " id="m_datepicker_2_validate" placeholder="Select Date" readonly="" type="text">

选择日期后，我将在（单击）上调用此函数，但我将此.staff\u book\u日期设置为未定义

---

如何将所选日期存储在staff\u book\u date等变量中

请勿在

ngModel

中使用管道。 另外，在

ngModel

<input [(ngModel)]="staff_book_date" 

---

在.ts文件中创建一个属性，并在.html中与之进行双向绑定

进行以下更改

.component.ts

staff_book_date : any;

bookStaffEmployeeDate(){
        console.log("This is the DATE:", this.staff_book_date);
}

component.html

<input [(ngModel)]="staff_book_date" class="form-control m-input " id="m_datepicker_2_validate" placeholder="Select Date" type="date">
<button (click)="bookStaffEmployeeDate()">Click Me</button>


点击我
尝试将输入标记中的
[ngModel]
更改为
[（ngModel）]
。这样做了，仍然没有定义。可能您在选择staff\u book\u date的值之前调用bookStaffEmployeeDate（）。否，是在选择日期之后。在日期选择器之后还有另一个输入，单击它，我调用了该函数。请尝试删除管道并在ngModel中添加双向绑定，但仍然显示未定义。删除管道后没有控制台错误。控制台输出：这是日期：未定义在哪里调用bookStaffEmployeeDate方法在我在输入字段上添加的日期选择器后面有另一个输入字段（单击）=“bookStaffEmployeeDate（）”。如果我尝试创建双向绑定模型，它会给出有关管道的错误。控制台日志中的错误：错误：未捕获（承诺中）：错误：模板解析错误：解析器错误：在ng:///ServiceModule/ServicesComponent中的[staff_book_date | date:'yyyy-MM-dd'=$event]的第19列中，操作表达式中不能有管道。html@809:40 ("以双向绑定方式删除管道。如果要使用管道格式化输入，请在删除管道后选中此选项。我没有收到任何错误，但控制台日志显示日期为未定义。控制台日志：这是日期：未定义如果您未在输入框中输入任何值，它将未定义，因为我们已声明
staff\u book\u date
not defined It、 此外，您已将输入设置为只读，您将无法对其进行编辑。
<input [(ngModel)]="staff_book_date" class="form-control m-input " id="m_datepicker_2_validate" placeholder="Select Date" type="date">
<button (click)="bookStaffEmployeeDate()">Click Me</button>