2015-11-02 73 views
9

在角度材质中使用md-datepicker指令时,日期格式似乎不适用于直接输入。md-datepicker输入格式

如果我在日历中选择一个日期,它将按照指定的方式显示(在我的情况下为DD-MM-YYYY),但如果我尝试手动更改输入,我的条目将被分析为MM-DD-YYYY。

到目前为止,我的日期选择器使用此代码this question

angular.module('MyApp').config(function($mdDateLocaleProvider) { 
    $mdDateLocaleProvider.formatDate = function(date) { 
    return date ? moment(date).format('DD-MM-YYYY') : ''; 
    }; 
}); 

Here设置是codepen在行动中看到的问题。

有没有办法设置输入格式?

回答

17

格式化日期事件是不够的。您还应该配置解析日期事件。

$mdDateLocaleProvider.parseDate = function(dateString) { 
    var m = moment(dateString, 'DD-MM-YYYY', true); 
    return m.isValid() ? m.toDate() : new Date(NaN); 
}; 

见更新笔:http://codepen.io/anon/pen/GpBpwZ?editors=101

5

完整的解决方案的基础是:

$mdDateLocaleProvider.formatDate = function(date) { 
return date ? moment(date).format('DD-MM-YYYY') : ''; 
}; 

$mdDateLocaleProvider.parseDate = function(dateString) { 
var m = moment(dateString, 'DD-MM-YYYY', true); 
return m.isValid() ? m.toDate() : new Date(NaN); 
}; 
0
config($mdDateLocaleProvider) { 
    $mdDateLocaleProvider.formatDate = function(date) {  
     if(date !== null) { 
     if(date.getMonthName == undefined) { 
      date.getMonthName = function() { 
      var monthNames = [ "January", "February", "March", "April", "May", "June", 
      "July", "August", "September", "October", "November", "December" ]; 
      return monthNames[this.getMonth()]; 
      } 
     }   
     var day = date.getDate(); 
     var monthIndex = date.getMonth(); 
     var year = date.getFullYear(); 
     return day + ' ' + date.getMonthName() + ' ' + year; 
     } 
    }; 
    }