angular-ui datepicker initial state of datepicker not formatted per datepicker-popup angular-ui datepicker initial state of datepicker not formatted per datepicker-popup angularjs angularjs

angular-ui datepicker initial state of datepicker not formatted per datepicker-popup


Where/where ever solutions I found they are lengthy, handling by directive etc. So I prefer this short one

birthday = $filter('date')(new Date(), "MMM dd, yyyy");

Note: Dont forget to inject angular built in $filter service into the controller

angular.module('app').controller("yourController", ['$filter' function($filter){        /* your code here */         birthday = $filter('date')(new Date(), "MMM dd, yyyy");       /* your code here */ }]);

Hope this helps.


I had similar issue, looks like bootstrap UI is incompatible with AngularJS 1.3.x version

This plunkr resolves the issue for me http://plnkr.co/edit/L9u12BeeBgPC2z0nlrLZ?p=preview

// this is the important bit:.directive('datepickerPopup', function (){  return {    restrict: 'EAC',    require: 'ngModel',    link: function(scope, element, attr, controller) {      //remove the default formatter from the input directive to prevent conflict      controller.$formatters.shift();    }  }});

Also refer to Github ticket https://github.com/angular-ui/bootstrap/issues/2659#issuecomment-60750976


To improve on Premchandra Singh's answer, using the angular $filter service does work but you need to also add a watch onto your date field to apply the filter on future updates:

$scope.myDate = $filter('date')(new Date(), 'dd.MM.yy');$scope.$watch('myDate', function (newValue, oldValue) {    $scope.myDate = $filter('date')(newValue, 'dd.MM.yy');});