Angular Strap: Date Range (Start Date Not Working)

Question

I am building a simple angular search form, which uses the bootstrap design framework and the Angular Strap module (found here: http://mgcrea.github.io/angular-strap/).

Everything works great except dynamic date ranges based on angular models.

What I want is quite simple: the second date input STARTS where the 1st input was selected. Heres the code that does NOT work:

Depart Date (1st input) [works fine]

<input required name="dapart_date" class="form-control" id="leave_date" placeholder="mm/dd/yyyy" ng-model="flightSearchData.depart_date" data-date-format="MM/dd/yyyy" data-use-native="true" data-autoclose="true" data-min-date="today" bs-datepicker>

Return Date (2nd input) [data-start-date doesn't work]

<input required name="return_date" class="form-control" id="return_date" placeholder="mm/dd/yyyy" ng-model="flightSearchData.return_date" data-date-format="MM/dd/yyyy" data-use-native="true" data-autoclose="true" data-min-date="{{flightSearchData.depart_date}}" data-start-date="{{flightSearchData.depart_date}}"  bs-datepicker>

data-min-date works fine but data-start-date only works if I hard code a date.

Any suggestions...?

Answer 1

It is not a solution, but a quick workaround that makes this datepicker usable for such a case.

I added a dateFrom watch and update dateTo accordingly:

$scope.$watch('dateFrom', function() {
        if ($scope.dateFrom) {
            $scope.dateTo = new Date($scope.dateFrom.getTime()); 
            // Basic date manipulation                                              
            $scope.dateTo.setDate($scope.dateFrom.getDate() + 1);
        }
    });

It makes dateTo datepicker to change its view to focus on selected date. It's not perfect, but works for me.