Allow Moment.js dates in bootstrap-ui datepicker

Question

I\'m trying to use Bootstrap UI\'s DatePicker with Moment.js dates.

It is possible if I convert my model value from Moment.js date to standard Date prior to

Answer 1

Decorating the original datepickerPopup and datepicker directives it's possible to achieve this conversion.

In this plunker I've changed the following methods:

• ngModel.$render on datepickerPopup;
• parseDate on datepickerPopup;
• minDate and maxDate $watches on datepicker;
• this.render on datepicker;
• this.refreshView on datepicker;
• this.createDateObject on datepicker;
• $scope.select on datepicker;

with moment.utc() and I'm pretty satisfied with the results. Let me know if it works for you.

Answer 2

I haven't tested this but you might be able to do this.

Create a customer filter that that returns the normal date...something like the below

angular.module('phonecatFilters', []).filter('momentToDate', function() {
    return function(momentDate) {
        if (moment.isMoment(momentDate)) {
            return momentDate.toDate();
        }else { return momentDate }
    };
});

Then where you declare you directive ng-model="yourmomentdate | momentToDate"