2017-05-12 4 views

答えて

1

Material2 datepickerはまだ作業中ですが、現在はうまく動作するmd2を使用しています。私はあなたが日付の範囲を行うことができると信じています(それはあなたが意味するものです)そうでなければ、それはあなたが後になっている日付ピッカーですか?

UPDATE: -

だから私はあなたが何をする必要があるかと思いますMD2のような定期的な日付ピッカーを使用して、ユーザーがクリックしたときに日付が新しく表示さ*ngForにリンクされている配列に追加しています日付は、その隣にXを追加、このような何か: -

コンポーネントの機能: -

public addNewDate(date) { 
    this.dateArray.push(date); 
} 

public removeDate(removedDate) { 
    this.dateArray = this.dateArray.filter((date: any) => { 
     return removedDate !== date; 
    }) 
} 

HTML: -

<md2-datepicker type="date" placeholder="Pick a date" 
       [(ngModel)]="newDate" 
       (ngModelChange)=addNewDate($event.target.value)> 
</md2-datepicker> 


<div *ngfor="let date of dateArray"> 
    {{date}}<span (click)="removeDate(date)">X</span> 
</div> 

コードはテストされていませんが、おおまかなやり方です。日付を使用して何か他のことをする必要がある場合は、それらをすべてコンポーネントの配列に入れます。

+0

私の完全な要件は、私は入力フィールドとdatepickerを持っていると私はdatePickerを開く場合、私は1つの日付を選択し、それはキャンセル記号と入力フィールドに表示されます私はダイアログボックスを開きます他の日付を選択すると、入力欄にキャンセル記号が表示され、以前選択した日付がdatepickerで選択されたものとして表示されます。 –

+0

私の答えを更新しました。 –