[英]md-datepicker must be a Date instance Error
I have a problem here. 我这里有问题。 I want to use Angular Material datepicker in my modal form.
我想以模态形式使用Angular Material datepicker。 I simply added it to my form like this
我只是将它添加到我的表单中
<md-datepicker ng-model="new.warranty" md-placeholder="Enter date"></md-datepicker>
And if I submitting form I got this: 如果我提交表格,我得到了这个:
Sun Apr 03 2016 00:00:00 GMT+0300 (EEST)
But I want to convert data in yyyy-MM-dd format before send, so I tried to convert date format in this way 但是我希望在发送之前以yyyy-MM-dd格式转换数据,所以我试图以这种方式转换日期格式
data.warranty = $filter('date')(Date.parse(data.warranty), 'yyyy-MM-dd');
So my form rly send a required yyyy-MM-dd format, but I get an error every time, when I sumbitting form. 所以我的表格发送了一个必需的yyyy-MM-dd格式,但每当我汇总表格时我都会收到错误。
`The ng-model for md-datepicker must be a Date instance. Currently the model is a: string`
so, how can I prevent this error, without using moment.js, if it possible, please. 那么,如果可能的话,我怎么能在不使用moment.js的情况下防止这个错误。
When you use $filter('date')
on your data.warranty
, you transform it from a Date
object to a String
, hence the error. 在
data.warranty
上使用$filter('date')
时,将它从Date
对象转换为String
,从而产生错误。
The fastest way to solve this is to have a duplicate of your date value as a string: 解决此问题的最快方法是将日期值复制为字符串:
<md-datepicker ng-model="new.warrantyDate" md-placeholder="Enter date"></md-datepicker>
Whenever you submit the form, before making a request, transform the date in the format you need, but don't overwrite the existing date : 每当您提交表单时,在提出请求之前,请以您需要的格式转换日期, 但不要覆盖现有日期 :
data.warranty = $filter('date')(Date.parse(data.warrantyDate), 'yyyy-MM-dd');
Thus your warrantyDate
value will remain a Date
object and will continue working. 因此,您的
warrantyDate
值将保留为Date
对象并将继续工作。 In case you modify the date in your response, do not forget to synchronize the warrantyDate
with the modified date. 如果您在响应中修改日期,请不要忘记将
warrantyDate
与修改日期同步。
Another option you could try is create a directive that will have different $modelValue
and $viewValue
for your data.warranty
variable. 您可以尝试的另一个选项是创建一个指令,该指令将为您的
data.warranty
变量提供不同的$modelValue
和$viewValue
。 For more information on how you can achieve this, consult the documentation on ngModelController
. 有关如何实现此目的的更多信息,请参阅
ngModelController
上的文档 。
The second option requires a deeper understanding of how angular works, so if you're at the very beginning of your angularjs path, you might go well with the first option. 第二个选项需要更深入地了解角度是如何工作的,所以如果你处于angularjs路径的最开始,你可能会选择第一个选项。
i've solved this issue by overriding md-datepicke ,Here is code 我已经通过覆盖md-datepicke解决了这个问题,这是代码
.directive('mdDatepicker', function ($parse) {
return {
require: 'ngModel',
link: function (scope, elem, attr, ngModel) {
$parse(attr.ngModel).assign(scope, new Date(_.get(scope, attr.ngModel)));
}
}
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.