Angular UI 2 datepickers range - angularjs

Question

I have a problem with AngularUI datepicker when i want to use 2 calendar in range each other.
When i select date in first calendar, the min date of the second calendar need to be higher than first.
So far no problem !
But, when i open the second calendar, the first date is good, but i can't click on date or can't switch month! Nothing do...
Here is my code
HTML :
<div ng-controller="test">
From <input id="from" ng-model="from" ui-date="formatCalendar" ng-change="updateDate()">
To <input id="to" ng-model="to" ui-date="formatCalendar2">
</div>
Javascript :
function test($scope){
$scope.to = null;
$scope.from = null;
$scope.formatCalendar = {
minDate: 0,
maxDate: 365,
defaultDate: "+1w",
numberOfMonths: 2,
changeMonth: true,
dateFormat: 'dd/mm/yy'
};
$scope.formatCalendar2 = {
defaultDate: "+1w",
numberOfMonths: 2,
changeMonth: true,
dateFormat: 'dd/mm/yy'
};
$scope.updateDate = function(){
$scope.formatCalendar2.minDate = $scope.from;
};
}
You can see demon # http://plnkr.co/edit/4tTHEIUzVRyQJ7NOCIAs?p=preview
Thanks for help :)

Answer 1

By looking at the source of ui-date, it seems that it has a watch on the whole config object. That watch will only fire if your config object is replaced, and not if you only modify a property on it. Something like this might work:
$scope.updateDate = function(){
// Just a simple way to clone the object to trigger
// the watch in ui-date
$scope.formatCalendar2 = JSON.parse(JSON.stringify($scope.formatCalendar2));
$scope.formatCalendar2.minDate = $scope.from;
};
EDIT:
Misread the code, the watch does fire because getOptions() returns a new object every time. I was able to get your code running here: http://jsbin.com/yibehape/2/edit
It sets the min date for the To field when changing the From field. So I'm guessing that there's some logical error in your code that you haven't showed us. You seem to have removed your plunker, did you get it working?