2017-09-08 14 views
1

はそれが角度材料は

DD/MM/YYYY

のような形式で入力を埋めるが、私は私が行うときに、フォーム、 を通じてそのデータを送信する必要があります私のコンポーネント上にconsole.log

datapicker.component.ts

onFindAWhip(form: NgForm){ 
    const value = form.value; 
    console.log(value); 
} 

私は

Thu Sep 28 2017 00:00:00 GMT+0100 (GMT Daylight Time) 

のような完全な日付を取得しています私は再び再フォーマットする必要がありますか?それはすでに私のDateAdapterで行うの

、これは私はここからそれを取得しようとしましたが、私はちょうどエラー

import { NativeDateAdapter } from '@angular/material'; 

export class MyDateAdapter extends NativeDateAdapter { 
    format(date: Date, displayFormat: Object): string { 

     let day = date.getDate(); 
     let month = date.getMonth(); 
     let year = date.getFullYear(); 

     if (displayFormat == "input") { 


      let pickupData = date.toDateString(); 
      let pickupDataArray = pickupData.split(" "); 
      let yearPicked = pickupDataArray[3]; 

      const without = pickupData.substring(0, pickupData.length-4); 

      return without + '  '+yearPicked ; 

     } else if (displayFormat == "input-home") { 
      return this._to2digit(day) + '/' + this._to2digit(month) +'/'+ year; 
     } 

     else{ 
     return date.toDateString(); 
     } 
    } 

    private _to2digit(n: number) { 
     return ('00' + n).slice(-2); 
    } 

} 

datapicker.html

<span class="calendar-to"> 
     <button md-raised-button (click)="pickupTo.open()" class="search--icon"></button> 
     <input [mdDatepicker]="pickupTo" 
       placeholder="DD/MM/YYYY" 
       name="date_to" 
       ngModel> 
     <md-datepicker touchUi="true" #pickupTo></md-datepicker> 
    </span> 

答えて

1

を取得しますngModelはDateTimeで、すべてという情報が含まれています。 DD/MM/YYYYのみ必要な場合は、コンポーネント内で処理する必要があります。実際にはコンポーネント内にAngular's DatePipeを使用して、これを迅速かつ簡単に行うことができます。

輸入パイプ:

import { DatePipe } from '@angular/common' 

ビルドアクセス:

onFindAWhip(form: NgForm){ 
    const value = form.value; 
    console.log(this.datePipe.transform(value, 'MM/dd/y')); 
} 
:メソッドで

constructor(private datePipe: DatePipe) { } 

使用