angular-UI datepicker apply date filter in controller

Question

I am using angular-ui's datepicker, I used this datepicker in many places of my application , so I have to apply date filter in each controller. To avoid this I need to apply date filter in base date picker controller

like $scope.formData.order_date = $filter('date')($scope.formData.order_date, 'dd-MM-yyyy');

Base datepicker controller:

controller('DatepickerDemoCtrl', [
    '$scope', function($scope) {
      $scope.today = function() {
        return $scope.dt = new Date();
      };
      $scope.today();
      $scope.showWeeks = true;
      $scope.toggleWeeks = function() {
        return $scope.showWeeks = !$scope.showWeeks;
      };
      $scope.clear = function() {
        return $scope.dt = null;
      };
      $scope.disabled = function(date, mode) {
        return mode === 'day' && (date.getDay() === 0 || date.getDay() === 6);
      };
      $scope.toggleMin = function() {
        var _ref;
        return $scope.minDate = (_ref = $scope.minDate) != null ? _ref : {
          "null": new Date()
        };
      };
      $scope.toggleMin();
      $scope.open = function($event,opened) {
        $event.preventDefault();
        $event.stopPropagation();
        console.log($scope);

        $scope[opened] = true;
      };

      $scope.dateOptions = {
        'year-format': "'yy'",
        'starting-day': 1
      };
      $scope.formats = ['dd-MM-yyyy', 'yyyy/MM/dd', 'shortDate'];
      return $scope.format = $scope.formats[0];
    }
  ]) 

How can I add common date filter in datepicker controller? Is it possible?

Answer 1

If it's just a basic date formatting you want to do, you can directly apply the "format-day", "format-month", and "format-year" elements on the datepicker tag itself. See the solution at this previously answered stackoverflow question: Angular bootstrap datepicker date format does not format ng-model value . See the documentation for more info: http://angular-ui.github.io/bootstrap/.