如何解决在Angular 10中使用Js Joda Library格式化Joda LocalDateTime变量
早上好
我有一个Angular 10应用程序,其中尝试在HTML页面中打印一些LocalDateTime变量。 从后端正确获取了LocalDateTime变量,并且该变量的类型为Joda.LocalDateTime,因为可以在邮递员的响应字段中看到该变量,所以序列化正确进行,例如:
"data_start_act": {
"year": 2020,"dayOfMonth": 19,"chronology": {
"zone": {
"fixed": true,"id": "UTC"
}
},"dayOfWeek": 6,"dayOfYear": 263,"era": 1,"weekyear": 2020,"centuryOfEra": 20,"monthOfYear": 9,"weekOfWeekyear": 38,"yearOfEra": 2020,"yearOfCentury": 20,"millisOfSecond": 0,"secondOfMinute": 0,"minuteOfHour": 0,"hourOfDay": 0,"millisOfDay": 0,"fields": [
{
"lenient": false,"leapDurationField": {
"unitMillis": 86400000,"precise": true,"name": "days","type": {
"name": "days"
},"supported": true
},"rangeDurationField": null,"minimumValue": -292275054,"maximumValue": 292278993,"durationField": {
"unitMillis": 31556952000,"precise": false,"name": "years","type": {
"name": "years"
},"name": "year","type": {
"durationType": {
"name": "years"
},"rangeDurationType": null,"name": "year"
},"supported": true
},{
"lenient": false,"rangeDurationField": {
"unitMillis": 31556952000,"minimumValue": 1,"maximumValue": 12,"durationField": {
"unitMillis": 2629746000,"name": "months","type": {
"name": "months"
},"name": "monthOfYear","type": {
"durationType": {
"name": "months"
},"rangeDurationType": {
"name": "years"
},"name": "monthOfYear"
},{
"rangeDurationField": {
"unitMillis": 2629746000,"maximumValue": 31,"lenient": false,"unitMillis": 86400000,"durationField": {
"unitMillis": 86400000,"name": "dayOfMonth","type": {
"durationType": {
"name": "days"
},"rangeDurationType": {
"name": "months"
},"name": "dayOfMonth"
},"supported": true,"leapDurationField": null
},{
"range": 86400000,"rangeDurationField": {
"unitMillis": 86400000,"maximumValue": 86399999,"unitMillis": 1,"durationField": {
"name": "millis","type": {
"name": "millis"
},"precise": true
},"minimumValue": 0,"name": "millisOfDay","type": {
"durationType": {
"name": "millis"
},"rangeDurationType": {
"name": "days"
},"name": "millisOfDay"
},"leapDurationField": null
}
],"fieldTypes": [
{
"durationType": {
"name": "years"
},"name": "year"
},{
"durationType": {
"name": "months"
},"rangeDurationType": {
"name": "years"
},"name": "monthOfYear"
},{
"durationType": {
"name": "days"
},"rangeDurationType": {
"name": "months"
},"name": "dayOfMonth"
},{
"durationType": {
"name": "millis"
},"rangeDurationType": {
"name": "days"
},"name": "millisOfDay"
}
],"values": [
2020,9,19,0
]
}
在Angular组件中导入了@js-joda/core
库以包装变量。
在HTML中,无法通过使用插值来打印整个LocalDateTime变量,因为打印了[Object Object]
而不是变量值,所以{{data_start_act}}
不起作用,但是我可以在其中打印字段使用插值,例如{{data_start_act.year}}
或{{data_start_act.dayOfMonth}}
的工作。
因此,我尝试使用JsJoda库的DateTimeFormatter
类对其进行格式化,该类通过以下方式在组件中声明为局部变量:dateTimeFormatter: DateTimeFormatter = DateTimeFormatter.ofPattern('d M y');
。
特别用于:
格式化程序功能
stringifyLocalDateTime(date: LocalDateTime): string {
return this.dateTimeFormatter.format(date);
}
HTML文件中的插值指令
{{stringifyLocalDateTime(lotto.data_start_act)}}
这样,我最终会在控制台中登录时出错:
core.js:4197 ERROR TypeError: this._temporal.getLong is not a function
at DateTimePrintContext.getValue (js-joda.esm.js:3888)
at NumberPrinterParser.print (js-joda.esm.js:5023)
at CompositePrinterParser.print (js-joda.esm.js:4742)
at DateTimeFormatter._formatTo (js-joda.esm.js:6897)
at DateTimeFormatter.format (js-joda.esm.js:6887)
at ListaBatchAnnualeComponent.stringifyLocalDateTime (lista-batch-annuale.component.ts:63)
at ListaBatchAnnualeComponent_div_18_div_12_Template (lista-batch-annuale.component.html:127)
at executeTemplate (core.js:7303)
at refreshView (core.js:7172)
at refreshEmbeddedViews (core.js:8280)
通过搜索网络,我找不到遇到相同或相似问题的任何人。 Angular在编译时不会给出错误。
现在的问题是:我的工作有问题吗?还有一种方法可以在Angular HTML模板中将Joda LocalDateTime显示为字符串,这并不意味着使用格式化程序(toString方法不起作用)?
解决方法
我遇到了同样的问题,现在知道是什么原因造成的。
当我收到响应 JSON 时,我认为它被正确地转换为正确的类型,即 LocaTime
中的 @Joda-js/core
,而实际上我的数据被编组为 string
。
这有点令人困惑,因为我创建了一个自定义管道来格式化一天中的时间,并且还明确地声明 LocalTime
作为函数的参数,传递 {{1} } 而不是 string
。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。