Question

我无法将在matdatepicker中输入的日期传递给方法。

代码段如下：

HTML：

<div class="div1">
   <form ng-controller="formCtrl" >
      <label style="float:left;padding:7px;"> From : </label>
      <mat-form-field style="float:left;padding:7px;">
        <input type="date" matInput [matDatepicker]="picker1" placeholder="Choose a date" ng-model="fromDate">
        <mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
        <mat-datepicker #picker1></mat-datepicker>
      </mat-form-field>
      <label style="float:left;padding:7px;"> To : </label>

      <mat-form-field style="float:left;padding:7px;">
        <input type="date" matInput [matDatepicker]="picker2" placeholder="Choose a date" ng-model="toDate">
        <mat-datepicker-toggle matSuffix [for]="picker2"></mat-datepicker-toggle>
        <mat-datepicker #picker2></mat-datepicker>
      </mat-form-field>
      <button type="submit" class="btn btn-info btn-sm" style="float:left;padding:8px;" (click)="getJobsByDateRange(fromDate,toDate)">
        <b>Submit</b></button>
   </form>
</div>

TS：

getJobsByDateRange(fromDate:Date, toDate:Date){
console.log(fromDate);
}

以下是我在控制台中获得的输出：

“未定义”。

如何以dd / MM / yyyy格式打印日期？

Answer 1

ng-model="fromDate"

这在Angular中不再存在。请改用它。

[(ngModel)]="fromDate"

Answer 2

我猜你使用角度材料2代码用于角度1.

请访问以下链接以获取角度1的材料日期选择器。

https://material.angularjs.org/latest/demo/datepicker

Answer 3

HTML

 <div class="div1">
       <form (ngSubmit)="onSubmit(f)" #f="ngForm" >
          <mat-form-field class="example-full-width mat-form-field-infix1">
            <input matInput [matDatepicker]="picker" placeholder="Choose a date" name="eventDate" [(ngModel)]="eventobj.eventDate" #eventDate="ngModel"
              required>
            <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
            <mat-datepicker #picker></mat-datepicker>

          </mat-form-field>
           <button mat-raised-button color="primary">Add Event</button>
       </form>
    </div>

TS：

eventobj = {


    eventDate: "Date",

  }

   onSubmit() {
   console.log(this.eventobj.eventDate);

   }

MatDatepicker日期未定义

3 个答案: