0

我认为描述这个问题的最好方法是引导你到 Plunk:

http://plnkr.co/edit/cRO5UgAyZx5SHJSKrzg7?p=preview

angular-ui 日期选择器不喜欢我们欧洲人!首先在日期选择器中选择一个日期。假设现在是 10 月 25 日(至少这一天应该大于 12)。您会看到 datepick-format 已设置为 dd.MM.yyyy,这反映在输入字段中设置的日期中。现在改变年份。这未在日期选择器中显示。但是,如果您以 MM.dd.yyyy 格式输入日期,则一切正常。

我添加了 angular-locale_de-de.js,从 Oktober 的拼写中可以看出它似乎正在工作。那么,为什么我不能以欧洲 [correct-and-logical-day-before-month] 格式输入日期?

4

2 回答 2

4

您可以使用角度指令。

var app = angular.module('plunker', ['ui.bootstrap']);
app.directive('formatteddate', function ($filter) {
    return {
        link: function (scope, element, attrs, ctrl) {
            ctrl.$parsers.unshift(function (viewValue) {
                return $filter('date')(viewValue,'dd.MM.yyyy');
            });            
        },
        restrict: 'A',
        require: 'ngModel'
    };
});

而不是在 HTML 中使用它

<input type="text" formatteddate="dt.date" .../>
于 2013-10-22T12:54:10.140 回答
0

好的,我已经想通了。问题在于新的 Date([dateString]) 方法,它只接受某些值。我从第 1148 行开始编辑了 ui-bootstrap-tpls-0.6.0.js。如您所见,angular-ui 团队有一个 TODO ;-)

  // TODO: reverse from dateFilter string to Date object
  function parseDate(viewValue) {
    if (!viewValue) {
      ngModel.$setValidity('date', true);
      return null;
    } else if (angular.isDate(viewValue)) {
      ngModel.$setValidity('date', true);
      return viewValue;
    } else if (angular.isString(viewValue)) {
      var date = new Date(viewValue);
      if (isNaN(date)) {
//   If the date is inputted in the European dd.mm.yyyy format, it will be invalid
//   This flips the month and the day around
          var dLastPos = dateFormat.lastIndexOf('d');
          var mPos = dateFormat.indexOf('M');
          var dSep, newViewValue;
          if(mPos>dLastPos){
              dSep = dateFormat.substr(mPos-dLastPos,1);
              newViewValue = viewValue.split(dSep);
              if(typeof newViewValue=='object'){
                  newViewValue=newViewValue[1]+dSep+newViewValue[0]+dSep+newViewValue[2];
              }
          }
          date = new Date(newViewValue);
          if (isNaN(date)) {
              ngModel.$setValidity('date', false);
              return undefined;
          } else {
              ngModel.$setValidity('date', true);
              return date;
          }
      } else {
        ngModel.$setValidity('date', true);
        return date;
      }
    } else {
      ngModel.$setValidity('date', false);
      return undefined;
    }
  }
于 2013-10-22T12:17:14.033 回答