AngularJS 1.3 - Datepicker initial format is incorrect

Question

I started using AngularJS 1.3 yesterday and one problem I have found is that the initial date in the Datepicker is not in the defined format. The format of the date is correct <

Answer 1

app.controller("DatepickerDemoCtrl", function ($scope,$filter) { .. // $filter added

$scope.today = function() {
    $scope.dt = $filter('date')(new Date(), $scope.format);
};

<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" ... // {{format}} added

Please check with these three modifications.

Answer 2

Not sure exactly what changed in 1.3, but there is a bug report for this.

Here's a drop-in directive for the initial value that fixes the problem until the bug is fixed. And here is a demo Plunker.

angular.module('myApp').directive('datepickerPopup', function (dateFilter, datepickerPopupConfig) {
    return {
        restrict: 'A',
        priority: 1,
        require: 'ngModel',
        link: function(scope, element, attr, ngModel) {
            var dateFormat = attr.datepickerPopup || datepickerPopupConfig.datepickerPopup;
            ngModel.$formatters.push(function (value) {
                return dateFilter(value, dateFormat);
            });
        }
    };
});