docs(datepicker): improve and fix month picker example (#10008)

This commit is contained in:
Juliano
2018-02-21 14:49:41 -03:00
committed by Joey Perrott
parent 514fa91418
commit c6915e33ac
4 changed files with 15 additions and 5 deletions
-1
View File
@@ -747,4 +747,3 @@ export class MatChipList extends _MatChipListMixinBase implements MatFormFieldCo
});
}
}
@@ -1 +1,7 @@
/** No CSS for this example */
.example-month-picker .mat-calendar-period-button {
pointer-events: none;
}
.example-month-picker .mat-calendar-arrow {
display: none;
}
@@ -1,6 +1,10 @@
<mat-form-field>
<input matInput [matDatepicker]="dp" placeholder="Month and Year" [formControl]="date">
<mat-datepicker-toggle matSuffix [for]="dp"></mat-datepicker-toggle>
<mat-datepicker #dp (yearSelected)="chosenYearHandler($event)"
(monthSelected)="chosenMonthHandler($event, dp)"></mat-datepicker>
<mat-datepicker #dp
startView="multi-year"
(yearSelected)="chosenYearHandler($event)"
(monthSelected)="chosenMonthHandler($event, dp)"
panelClass="example-month-picker">
</mat-datepicker>
</mat-form-field>
@@ -1,4 +1,4 @@
import {Component} from '@angular/core';
import {Component, ViewEncapsulation} from '@angular/core';
import {FormControl} from '@angular/forms';
import {MatDatepicker} from '@angular/material/datepicker';
import {MomentDateAdapter} from '@angular/material-moment-adapter';
@@ -31,6 +31,7 @@ export const MY_FORMATS = {
selector: 'datepicker-views-selection-example',
templateUrl: 'datepicker-views-selection-example.html',
styleUrls: ['datepicker-views-selection-example.css'],
encapsulation: ViewEncapsulation.None,
providers: [
// `MomentDateAdapter` can be automatically provided by importing `MomentDateModule` in your
// application's root module. We provide it at the component level here, due to limitations of