title: Allow Moment.js dates in bootstrap-ui datepicker
body: <p>I'm trying to use <a href="http://angular-ui.github.io/bootstrap/">Bootstrap UI's</a> <a href="http://angular-ui.github.io/bootstrap/#/datepicker">DatePicker</a> with <a href="http://momentjs.com/">Moment.js</a> dates.</p>
  
  <p>It is possible if I convert my model value from Moment.js date to standard <code>Date</code> prior to assigning it to a scope:</p>
  
  <pre class="lang-js prettyprint-override"><code>$scope.myDate = moment('2014-11-07T21:20:15').toDate();
  </code></pre>
  
  <p>However, I would like it to be as transparent as possible, i.e. without the need for manual prior conversion.</p>
  
  <p>I've tried to add wrapping formatters and parsers via directive extension, but it's not working as I'm expecting:</p>
  
  <pre class="lang-js prettyprint-override"><code>angular
      .module('DatepickerWorkaround', [])
      .directive('datepickerPopup', function () {
          return {
              restrict: 'EAC',
              require: 'ngModel',
              priority: -10,
              link: function ($scope, element, attrs, ngModel) {
  
                  // Remove the default formatter from the input directive to prevent conflict.
                  // This is required for compatibility with AngularJS 1.3.x.
                  ngModel.$formatters.shift();
  
                  // Casting Moment.js date to standard date.
                  ngModel.$formatters.unshift(function(momentDate) {
                      if (moment.isMoment(momentDate)) {
                          return momentDate.toDate();
                      }
                  });
  
                  // Casting standard date back to Moment.js date.
                  ngModel.$parsers.push(function(date) {
                      if (date instanceof Date) {
                          return moment(date);
                      }
                  });
              }
          }
      })
  ;
  </code></pre>
  
  <p>With this extension date is displayed correctly in the input field, but when popup opens the incorrect date is selected inside of it.</p>
  
  <p>Also, I'm not quite sure what value should I use for directive <code>priority</code> property and what methods should I call on <code>$formatters</code> and <code>$parsers</code>, i.e. <code>push()</code> vs <code>unshift()</code>.</p>
  
  <p>Is there a way to make Bootstrap UI's DatePicker work with Moment.js dates transparently?</p>