当将日期格式指定为'd-M-yyyy'，并将ng-model的字符串值指定为"2014-08-31T00:00:00Z"时，Angular-UI日期选择器处于无效状态. [英] Angular-UI date picker is in invalid state when specified the date format as 'd-M-yyyy' and ng-model with a string value as "2014-08-31T00:00:00Z"

问题描述

我从asp.net mvc控制器获取日期时间值为"2014-08-31T00:00:00Z".当我将此值绑定到我的angular-ui datepicker控件时，其状态显示为ng-invalid ng-invalid-date.

I am getting a date time value from asp.net mvc controller as "2014-08-31T00:00:00Z". When I bind this value to my angular-ui datepicker control it's state is showing as ng-invalid ng-invalid-date.

我也从mvc控制器获取日期格式，因此我也在HTML中绑定了日期格式.

I am getting the date-format as well from the mvc controller so I am binding the date-format as well in my html.

当我在第1807行调试ui-bootstrap-tpls.js(最新版本)文件时

When I am debugging the ui-bootstrap-tpls.js (latest version) file at line 1807

总是以未定义的形式出现.我尝试了很多替代方法，但我无法成功. :(

It's always coming as undefined. I have tried so many alternatives but I am unable to succeed. :(

> javascript不会转换ui的日期正确地设置为UTC

所以请给我一些想法，并建议我如何解决这个问题.

So please give some thoughts and suggest me how can I solve this problem.

感谢&问候， 穆拉里·克里希纳(N.Murali Krishna).

Thanks & Regards, N.Murali Krishna.

推荐答案

我遇到了同样的问题.问题在于Angular需要一个实际的日期对象，而不是日期的字符串表示形式.经过大量研究后，我最终在$ httpProvider中添加了一个transformReponse，它检查所有字符串对象以查看它们是否可以转换为日期，以及是否可以将其转换为日期.

I had the same problem. The issue is that Angular is expecting an actual date object, not a string representation of the date. After doing a bunch of research I ended up adding a transformReponse to the $httpProvider which checks all string objects to see if they can be converted to a date, and if so actually converting them.

angular.module('test')
.config(['$httpProvider', function ($httpProvider) {

    // ISO 8601 Date Pattern: YYYY-mm-ddThh:MM:ss
    var dateMatchPattern = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}/;

   var convertDates = function (obj) {
      for (var key in obj) {
         if (!obj.hasOwnProperty(key)) continue;

         var value = obj[key];
         var typeofValue = typeof (value);

         if (typeofValue === 'object') {
            // If it is an object, check within the object for dates.
            convertDates(value);
         } else if (typeofValue === 'string') {
            if (dateMatchPattern.test(value)) {
               obj[key] = new Date(value);
            }
         }
      }
   }

   $httpProvider.defaults.transformResponse.push(function (data) {
      if (typeof (data) === 'object') {
         convertDates(data);
      }

      return data;
   });
}])

这篇关于当将日期格式指定为'd-M-yyyy'，并将ng-model的字符串值指定为"2014-08-31T00:00:00Z"时，Angular-UI日期选择器处于无效状态.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！