title: Angular Bootstrap Datepicker - Disable all dates except a specified list
body: <p>I've been stuck on this issue for a couple of days now and I cannot find any suitable example online to help. I am getting a list of dates from a rest service that I need to make available within the angular datepicker to be selected. When I have this list I need to disable every other date in the datepicker. Here is my current code examples to show this - </p>
  
  <p>Here is a plunker - <a href="https://plnkr.co/edit/8zncfr2VBayaO7wRFV4C?p=preview" rel="nofollow">https://plnkr.co/edit/8zncfr2VBayaO7wRFV4C?p=preview</a></p>
  
  <p>HTML SNIPPET---</p>
  
  <pre><code>&lt;div role="tabpanel" class="tab-pane" id="calender"&gt;
      &lt;h3 class="map_tab_title"&gt; Select Days &lt;/h3&gt;
      &lt;div uib-datepicker ng-model="date_pick" datepicker-options="options" date-disabled="disabled(data)"&gt;
      &lt;/div&gt;
      &lt;button type="submit" class="btn book_now_btn" ng-click="goToBookPage()"&gt;final step &lt;span&gt; input your information &lt;/span&gt;    
      &lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>ANGULAR SNIPPET -</p>
  
  <pre><code>$scope.dates = response.data.outgoing.dates;
  $scope.date_pick = Date.parse($scope.dates[0]);
  
  $scope.today = function(){
      $scope.date_pick = new Date();
  };
  $scope.today();
  $scope.options = {
      minDate: new Date(),
      showWeeks: false
  };
  
  function areDatesEqual(date1, date2) {
      return date1 == date2;
  }
  $scope.disabled = function(data) {
      console.log("TRIGGERED");
      var date = data.date,
          mode = data.mode;
      var isRealDate = false;
      for (var i = 0; i &lt; $scope.dates.length; i++) {
          if (areDatesEqual($scope.dates[i], date)) {
              isRealDate = true;
          }
      }                
      return (mode === 'day' &amp;&amp; isRealDate);
  };
  </code></pre>
  
  <p>Can someone please help me with this. I am at a loss. 
  Thanks in advance! </p>