title: update Angular-UI bootstrap datepicker options after date change
body: <p>I am using the angular-UI Bootstrap datepicker. I have two dependent datepickers, which represent start &amp; end date. So that means, the start date is not allowed to be bigger then the end date and vice versa.</p>
  
  <p>As the user can choose a date in a period of time, the min and max range for the start and end date changes. However right now, I did not really find a way to update the min and max date, as it is not done automatically. Anyone knows how to do that?</p>
  
  <p>I tried calling an update function which updates the <code>shipSearchStartDateOptions.maxValue</code> or the <code>shipSearchEndDateOptions.minValue</code> which would be called in the ng-change part, however that did not work at all. The options did not change the min or max date.</p>
  
  <p>Right now, even the initial settings of the options are not working. Even though I have nearly the same code as stated in the examples.</p>
  
  <p>This is the console log of the options at the initial call:</p>
  
  <blockquote>
    <p>Object {maxDate: Mon Apr 04 2016 13:00:00 GMT+0200 (CEST), minDate:
    Sun Mar 13 2016 00:00:00 GMT+0100 (CET)} </p>
    
    <p>Object {maxDate: Mon Apr 04
    2016 13:00:00 GMT+0200 (CEST), minDate: Sun Mar 13 2016 00:00:00
    GMT+0100 (CET)}</p>
  </blockquote>
  
  <p>JS code:</p>
  
  <pre><code>$scope.firstAvailableDate = DataProvider.getFirstTimestamp();
  $scope.lastAvailableDate = DataProvider.getLastTimestamp();
  $scope.searchStartDate = $scope.firstAvailableDate;
  $scope.searchEndDate = $scope.lastAvailableDate;
  
  $scope.shipSearchStartDate = {
    opened: false
  };
  
  $scope.shipSearchEndDate = {
    opened: false
  };
  
  $scope.shipSearchStartDateOptions = {
    formatYear: 'yy',
    maxDate: $scope.searchEndDate,
    minDate: $scope.firstAvailableDate
  };
  
  $scope.shipSearchEndDateOptions = {
    formatYear: 'yy',
    maxDate: $scope.lastAvailableDate,
    minDate: $scope.searchStartDate
  };
  
  $scope.shipSearchStartOpen = function() {
    $scope.shipSearchStartDate.opened = true;
  };
  
  $scope.shipSearchEndOpen = function() {
    $scope.shipSearchEndDate.opened = true;
  };
  
  $scope.updateOptions = function () {
    $scope.shipSearchStartDateOptions.maxValue = $scope.searchEndDate;
    $scope.shipSearchEndDateOptions.minValue = $scope.searchStartDate;
  };
  </code></pre>
  
  <p>HTML Code:</p>
  
  <pre><code>&lt;div class="row"&gt;
     &lt;div class="col-md-6"&gt;
       &lt;p class="input-group"&gt;
         &lt;input type="text" class="form-control" ng-model="searchStartDate"
             ng-change="clearShipSearch(); shipSearch(); updateOptions();" uib-datepicker-popup
             is-open="shipSearchStartDate.opened" datepicker-options="shipSearchStartOptions"
             show-button-bar="false" /&gt;
          &lt;span class="input-group-btn"&gt;
             &lt;button type="button" class="btn btn-default" ng-click="shipSearchStartOpen()"&gt;
               &lt;i class="glyphicon glyphicon-calendar"&gt;&lt;/i&gt;
             &lt;/button&gt;
          &lt;/span&gt;
       &lt;/p&gt;
     &lt;/div&gt;
  
     &lt;div class="col-md-6"&gt;
       &lt;p class="input-group"&gt;
         &lt;input type="text" class="form-control" ng-model="searchEndDate"
            ng-change="clearShipSearch(); shipSearch(); updateOptions();" uib-datepicker-popup
            is-open="shipSearchEndDate.opened" datepicker-options="shipSearchEndOptions"
            show-button-bar="false" /&gt;
         &lt;span class="input-group-btn"&gt;
            &lt;button type="button" class="btn btn-default" ng-click="shipSearchEndOpen()"&gt;
              &lt;i class="glyphicon glyphicon-calendar"&gt;&lt;/i&gt;
            &lt;/button&gt;
         &lt;/span&gt;
       &lt;/p&gt;
     &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>