Javascript AngularJS输入类型=datetime本地:预期ISO-8601-有效日期字符串为日期
使用AngularJS和AngularResource 1.4.1,我有一个超级简单的Javascript AngularJS输入类型=datetime本地:预期ISO-8601-有效日期字符串为日期,javascript,angularjs,datetime,Javascript,Angularjs,Datetime,使用AngularJS和AngularResource 1.4.1,我有一个超级简单的事件服务,它的开始日期是可选的结束日期: angular.module('jtm.events').factory( 'Event', [ '$resource', function($resource) { var Event = $resource( '/events/:id.json', {id: '@id'} ); // EDIT: added this m
事件
服务,它的开始日期是可选的结束日期:
angular.module('jtm.events').factory( 'Event', [
'$resource',
function($resource) {
var Event = $resource( '/events/:id.json',
{id: '@id'}
);
// EDIT: added this method
Event.index = function() {
var events = this.query();
angular.forEach( events, function($event) {
$event.start_date = new Date($event.start_date);
});
return events;
};
return Event;
}
]);
Event.query()
的典型结果如下所示:
[
{
id: 1,
start_time: "2015-08-25T00:47:16Z",
end_time: null
...
},
...
]
在(面向最终用户的)前端,我通过我设置的moment.js过滤器运行这些日期,并按照预期呈现它们,没有任何js错误。但是,在管理事件表单上,我有:
<input type="datetime-local" ng-model="event.start_time" ng-required="true">
并在管理表单字段中呈现占位符mm/dd/yyyy,--:-->
掩码
这不是有效的ISO 8601日期字符串吗?我是否需要以某种方式更改服务/模块配置以使其正常工作
编辑
我没有定义自定义的索引
操作,而是使用拦截器覆盖查询
操作配置,将开始时间
字符串包装在适当的日期
对象中:
angular.module('jtm.events').factory( 'Event', [
'$resource',
function($resource) {
var Event = $resource( '/events/:id.json',
{id: '@id'},
{
query: {
action: 'query',
isArray: true,
transformResponse: function(response) {
response = angular.fromJson(response);
angular.forEach( response, function($event) {
$event.start_time = new Date($event.start_time);
});
return response;
},
},
}
);
return Event;
}
]);
您需要在输入元素ng模型中传递日期对象,而不是字符串
use this
start_time: new Date("2015-08-25T00:47:16Z")
ins ted of:-
start_time: "2015-08-25T00:47:16Z"
您可以从这个链接获取帮助
[plnkr]:http://plnkr.co/edit/QaA31F?p=preview
您需要在输入元素ng模型中传递日期对象,而不是字符串
use this
start_time: new Date("2015-08-25T00:47:16Z")
ins ted of:-
start_time: "2015-08-25T00:47:16Z"
您可以从这个链接获取帮助
[plnkr]:http://plnkr.co/edit/QaA31F?p=preview
我建议使用一些日期时间选择器库,因为HTML输入类型=“datetime local”仅在chrome和FF以及IE中受支持,它将成为简单的HTML输入文本元素……谢谢,这为我指明了正确的方向。但是,
start\u time
封装在服务中;如何从那里而不是在控制器内将其传递到日期对象?(请参见编辑)谢谢,@acobster,您可以使用另一个模式变量绑定到日期字段,并可以使用ngModel options getter setter跟踪更改并将日期的字符串表示形式存储在您的对象返回表单服务中。您也可以使用ng change来跟踪更改。谢谢,我最后在我的事件服务上使用了一个拦截器来完成相同的任务。我建议使用一些日期时间选择器库,因为HTML input type=“datetime local”仅在chrome和FF以及IE中受支持,它将成为简单的HTML输入文本元素…谢谢,这为我指明了正确的方向。但是,start\u time
封装在服务中;如何从那里而不是在控制器内将其传递到日期对象?(请参见编辑)谢谢,@acobster,您可以使用另一个模式变量绑定到日期字段,并可以使用ngModel options getter setter跟踪更改并将日期的字符串表示形式存储在您的对象返回表单服务中。您还可以使用ng change来跟踪更改。谢谢,我最终在我的事件服务上使用了拦截器来完成相同的任务。