ng2-datepickerのngmodel値を設定し、キーボードで編集できないようにします。

Question

プロジェクトでng2-datepickerを使用しています。これは私が使用しているコードです。

<ng2-datepicker class="form-control" required [options]="{format:'MMM DD YYYY'}" [(ngModel)]="User.StartDate" name="StartDate"        #StartDate="ngModel"></ng2-datepicker> 

私は

1. キーボードによる非編集可能にするために、そのことができないで立ち往生しています。

2. 私の要件モデルによると、User.StartDateは日付文字列のみをバインドする必要があります。しかし、それは{day： "12"、フォーマット： "May 12 2017"、momentObject： "2017-05-11T18：30：00.000Z"、月： "05"、年： "2017" }。このng2-datepickerに日付文字列だけを保持する方法はありますか？コンポーネントで

Answer 1

あなたはここでフォーマット

ソート例のオプションを設定することができますテンプレートファイルで

import { DatePickerOptions, DateModel } from 'ng2-datepicker'; 

export class Component implements OnInit { 

    public options: DatePickerOptions; 

    ngOnInit() { 
     this.options = { 
      format: "MM-DD-YYYY", 
     }; 
     //You should initialize date attribute like 
     this.user.StartDate = {formatted: 'MM-DD-YYYY'}; // It will work as placeholder/default value; 

     // If you want blank on init 
     //this.user.StartDate = {formatted: ''}; 
    } 
    //before save data 
    save() { 
     this.user.StartDate = this.user.StartDate.formatted; 
    } 

    //To make it non-editable by a keyboard, but allow Tab and Shift+Tab key 
    eventHandler(event) 
    { 
     if(event.keyCode == 9) { 
      if(event.shiftKey) 
      { 
       return true; 
      } 
      return true; 
     } 
     else { 
      return false; 
     } 
    } 
} 

を：

<ng2-datepicker name="StartDate" [options]="options" [(ngModel)]="user.StartDate" (keydown)="eventHandler($event)"></ng2-datepicker>