UNPKG

md-date-range-picker

Version:

Angular Material Date Range Picker

56 lines 2.04 kB
<div layout="row" flex> <div layout="column"> <h2>Disable First/Last Day of Week</h2> <md-date-range-picker first-day-of-week="1" selected-template="calendarModel.selectedTemplate" selected-template-name="calendarModel.selectedTemplateName" show-template="true" date-start="calendarModel.dateStart" date-end="calendarModel.dateEnd" is-disabled-date="isDisabledDate($date)"></md-date-range-picker> <div> <h2>Picker</h2> <md-date-range ng-model="calendarModel" is-disabled-date="isDisabledDate($date)"></md-date-range> </div> </div> <div layout="column" style="width: 380px"> <h2>Bindings</h2> <code flex> <table style="text-align: left" cellspacing="10"> <tr> <th>Property</th> <th>Value</th> </tr> <tr> <td>selectedTemplate</td> <td>{{calendarModel.selectedTemplate}}</td> </tr> <tr> <td>selectedTemplateName</td> <td>{{calendarModel.selectedTemplateName}}</td> </tr> <tr> <td>dateStart</td> <td>{{calendarModel.dateStart | date : 'medium'}}</td> </tr> <tr> <td>dateEnd</td> <td>{{calendarModel.dateEnd | date : 'medium'}}</td> </tr> <tr> <td>firstDayOfWeek</td> <td>0 Sunday</td> </tr> </table> </code> </div> <div layout="column" flex> <h2>Html</h2> <textarea readonly flex style="font-family: Lucida Console, Monaco, monospace"> <md-date-range-picker first-day-of-week="0" selected-template="calendarModel.selectedTemplate" selected-template-name="calendarModel.selectedTemplateName" show-template="true" is-disabled-date="isDisabledDate($date)" date-start="calendarModel.dateStart" date-end="calendarModel.dateEnd"> </md-date-range-picker> </textarea> </div> </div>