title: Angular: How to configure a Date Picker to disable multiple date ranges?
body: <p>I have a list of objects (Ranges) with attributes <code>startDate</code> and <code>endDate</code>. I need to disable user input on a date picker for dates that fall within these ranges.</p>
  
  <p>For example, I want to disable dates between <code>09-01-2019</code> and <code>09-02-2019</code> as well as dates between <code>09-05-2019</code> and <code>09-06-2019</code>.</p>
  
  <p>I tried [angular-mydatepicker](<a href="https://github.com/kekeh/angular-mydatepicker" rel="nofollow noreferrer">https://github.com/kekeh/angular-mydatepicker</a> datepicker), which has an option <code>disableDateRanges</code> but I don't know how to apply multiple date ranges.</p>
  
  <p>Here is my code: </p>
  
  <pre><code>&lt;input matInput angular-mydatepicker name="startPicker" 
    formControlName="startPicker" (click)="dp.toggleCalendar()"
                   [options]="myStartOptions" #dp="angular-mydatepicker"/&gt;
  </code></pre>
  
  <p>How can I resolve this or is there another date picker that can handle this use case?</p>