Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Datepicker
<!-- デートピッカー -->
<md-input-container>
<input
mdInput
placeholder="日付を入力してください..."
[mdDatepicker]="myDatePicker"
[mdDatepickerFilter]="datepicker.filter"
[min]="datepicker.min"
[max]="datepicker.max"
[(ngModel)]="datepicker.model"/>
<button mdSuffix [mdDatepickerToggle]="myDatePicker"></button>
</md-input-container>
<md-datepicker #myDatePicker [startAt]="datepicker.min" (selectedChanged)="changeDatePicker()"></md-datepicker>
<br>
<!-- タッチインターフェース -->
<md-input-container>
<input mdInput [mdDatepicker]="pickerTouch"/>
<!-- <button mdSuffix [mdDatepickerToggle]="pickerTouch"></button> -->
<md-icon mdSuffix (click)="pickerTouch.open()">home</md-icon>
</md-input-container>
<md-datepicker #pickerTouch touchUi="true"></md-datepicker>
<button md-raised-button startView="Year" (click)="pickerTouch.open()">Open</button>
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-datepicker',
templateUrl: './datepicker.component.html',
styleUrls: ['./datepicker.component.css']
})
export class DatepickerComponent implements OnInit {
ngOnInit() {}
datepicker = {
'model' : '',
'filter' : (date : Date)=>{
let day = date.getDay();
// 日(0)、または土(6)以外
return day != 0 && day != 6
},
'min' : new Date(2010, 3, 1),
'max' : new Date(2020, 2, 31)
}
changeDatePicker() : void {
console.dir(this.datepicker);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment