Moment js - 显示距离日期还有几天和几小时

2024-01-26

我正在开发一个项目,需要对日期对象进行这种文本响应。

“1天7小时路程” --- 需要这样 - 而不是“距离 31 小时”或“距离 1 天” -- 我也在使用 moment js - 因为我正在英语和德语之间进行语言切换 - 所以我已经利用了 moment.js 语言区域设置

moment.locale('de')

我正在使用 moment js - 目前我创建了一个假日期对象

  var futureDate = new Date()
  futureDate.setDate(futureDate.getDate() + 1)// add a day
  futureDate.setHours(7)// add 7 hours

当我尝试渲染时刻 js 时

moment(futureDate).endOf('day').fromNow()

它只是说“一天之内”

如何修改 moment 函数以处理 1 天 7 小时——或者重新调整句子?

--- 代码片段尝试

moment.locale('de') // switch between en and de -- english and german

var futureDate = new Date()
futureDate.setDate(futureDate.getDate() + 1)// add a day
futureDate.setHours(7)// add 4 hours

// Results in hours
console.log(moment(futureDate).endOf('day').fromNow()); 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>

使用差异进行代码测试2

moment.locale('de') // switch between en and de -- english and german

var a = moment();
var b = moment(a).add(31, 'hours');

// Results in days
console.log(b.diff(a, 'days'));
console.log(b.diff(a, 'days', true)); 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>

您可以使用relativeTimeThreshold http://momentjs.com/docs/#/customization/relative-time-threshold/ and relativeTime http://momentjs.com/docs/#/customization/relative-time/(键为moment.updateLocale)自定义时刻如何显示相对时间(例如fromNow()输出)。

对于您的情况,您可以:

  • 调整阈值以获得以秒为单位的差异(请参阅:如何让 moment.js 显示以秒为单位的相对时间? https://stackoverflow.com/q/42216583/4131048).
  • 使用创建持续时间对象moment.duration(Number, String) http://momentjs.com/docs/#/durations/creating/.
  • Use 时刻-持续时间-格式 http://momentjs.com/docs/#/plugins/duration-format/插件以您喜欢的格式显示持续时间值。

这是一个实时示例:

var momEn = moment().add({d:1, h:7});
var momDe = moment().locale('de').add({d:1, h:7});

console.log(momEn.fromNow()); // in a day
console.log(momDe.fromNow()); // in einem Tag

// Change relativeTimeThreshold
moment.relativeTimeThreshold('s', 60*60*24*30*12);

// Update relative time
moment.updateLocale('en', {
  relativeTime : {
    s: function (number, withoutSuffix, key, isFuture){
      return moment.duration(number, 's').format('d [day] h [hour]');
    },
  }
});

moment.updateLocale('de', {
  relativeTime : {
    s: function (number, withoutSuffix, key, isFuture){
      return moment.duration(number, 's').format('d [Tag] h [Uhr]');
    },
  }
});

console.log(momEn.fromNow()); // in 1 day 7 hour
console.log(momDe.fromNow()); // in 1 Tag 7 Uhr
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-duration-format/1.3.0/moment-duration-format.min.js"></script>

不幸的是,您必须手动更新需要支持的每个区域设置。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Moment js - 显示距离日期还有几天和几小时 的相关文章

  • 从 thymeleaf 获取数据到模态引导程序、jquery

    我正在尝试获取模态视图的 id 这是为了更新 onclick 元素 但我找不到方法 知道如何为 boostrap 5 完成此操作 或我可以用其他方法吗 谢谢 tr a inactivate a div class modal fade mo
  • 将 OoXml 插入单词抛出错误:未知

    我一直在尝试通过office js将OOXML插入到word文档的正文内容中insertOoXML 方法 我什至尝试过最简单的实现 认为我在尝试替换 XML 本身中的 fieldCodes 时做了一些不正确的事情 所有结果都是这样Error
  • JavaScript onTouch 不工作

    谁能告诉我为什么这个 onTouch 处理程序没有触发 var myDiv document getElementById existingContent var myButton a href log out a myDiv append
  • 在 javascript/jquery 中将光标更改为等待

    当调用函数时 如何让光标更改为此加载图标以及如何将其更改回 javascript jquery 中的普通光标 在你的 jQuery 中使用 body css cursor progress 然后又恢复正常 body css cursor d
  • 关闭选项卡时要求确认[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 当我在某些浏览器上关闭页面时 我希望出现一个消息框 并询问我是否真的要关闭页面 有两个按钮 如果我单击No那么这个标签就不会被关闭 我怎样
  • 从数据 URI 解码 QR 码

    我尝试从数据 uri 中解码二维码 var dataUri data image gif base64 R0lGODdh9gD2AIAAAAAAAP ywAAAAA9gD2AAAC decodeQrCode dataUri cb 我已经尝试
  • 尝试将布尔 C# 变量传递给 javascript 变量并将其设置为 true

    在我的 aspx 页面中 我将布尔变量 C 传递给需要布尔类型的 javascript 函数 但遇到了问题 但是 C 变量返回 True 而 javascript 不喜欢大写 myjavascript 如果我将 c 变量转换为字符串 那么我
  • 使用 useReducers 调度函数发送多个操作?

    使用时是否可以通过调度函数发送多个动作useReducer挂钩反应 我尝试向它传递一组操作 但这会引发未处理的运行时异常 明确地说 通常会有一个初始状态对象和一个减速器 如下所示 const initialState message1 nu
  • jQuery AJAX 调用 Java 方法

    使用 jQuery AJAX 我们可以调用特定的 JAVA 方法 例如从 Action 类 该 Java 方法返回的数据将用于填充一些 HTML 代码 请告诉我是否可以使用 jQuery 轻松完成此操作 就像在 DWR 中一样 此外 对于
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 在 Wordpress 站点中进行 AJAX 调用时出现问题

    我在使用 Wordpress 站点功能的 AJAX 部分时遇到了一些问题 该功能接受在表单上输入的邮政编码 使用 PHP 函数来查找邮政编码是否引用特定位置并返回到该位置的永久链接 我的第一个问题是关于我构建的表单 现在我的表单操作是空白的
  • 如何监听 jQuery AJAX 请求?

    以下两种实现 ajaxRequest 1 2 的方法应该是等效的 话说回来 为什么验证回调已执行的单元测试 3 在 1 中成功而在 2 中失败 我应该如何重写测试 3 来监视 2 中的成功回调 如果我尝试stub jQuery ajax使用
  • 标签获取 href 值

    我有以下 html div class threeimages a img alt Australia src Images Services 20button tcm7 9688 gif a div class text h2 a hre
  • 音频 blob 的 URL.createObjectURL 在 Firefox 中给出 TypeError

    我正在尝试从创建的音频 blob 创建对象 URLgetUserMedia 该代码在 Chrome 中可以运行 但在 Firefox 中存在问题 错误 当我打电话时stopAudioRecorder 它停在audio player src
  • 使用 KnockoutJs 映射插件进行递归模板化

    我正在尝试使用以下方法在树上进行递归模板化ko映射 插入 http knockoutjs com documentation plugins mapping html 但我无法渲染它 除非我定义separate每个级别的模板 在以下情况下
  • Meteor - 从客户端取消服务器方法

    我正在通过服务器方法执行数据库计数 用户可以选择他们希望如何执行计数 然后调用该方法 我的问题是 计数可能需要一些时间 并且用户可能会在方法运行时改变主意并请求不同的计数 有什么方法可以取消调用的方法并运行新的计数吗 我认为 this un
  • 为 illustrator 导出脚本以保存为 web jpg

    任何人都可以帮我为 illustrator CC2017 编写一个脚本 将文件以 JPG 格式导出到网络 旧版 然后保存文件并关闭 我有 700 个文件 每个文件有 2 个画板 单击 文件 gt 导出 gt 另存为 Web 旧版 然后右键文
  • FireFox 中的自动滚动

    我的应用程序是实时聊天 我有一个 Div 来包装消息 每条消息都是一个 div 所以 在几条消息之后 我的 DOM 看起来像这样 div div Message number two div div div div
  • 如何更改此 jquery 插件的时区/时间戳?

    我正在使用这个名为 timeago 的插件 在这里找到 timeago yarp com 它工作得很好 只是它在似乎不同的时区运行 我住在美国东部 费城时区 当我将准确的 EST 时间放入 timeago 插件时 比如 2011 05 28
  • 如何仅在最后一个
  • 处给出透明六边形角度?
  • 我必须制作这样的菜单 替代文本 http shup com Shup 330421 1104422739 My Desktop png http shup com Shup 330421 1104422739 My Desktop png

随机推荐

  • 如何最小化 R 包的安装大小

    在我的工作场所 我们正在为不同版本的 R 安装许多库 所需的大小正在迅速增加 我可以做什么来尽可能减少每次安装 我知道 no docs 并且我需要 with keep source EDIT 这是对我的设置的快速研究 我将我的图书馆复制到
  • 详细了解 openCV aruco 标记检测/姿态估计:亚像素精度

    我目前正在研究openCV的 aruco 模块 特别关注ArUco标记和AprilTags的poseEstimation 在研究子像素精度时 我遇到了一种奇怪的行为 如下代码所示 如果我确实提供了 完美 校准 例如 cx cy 等于图像中心
  • 在外部登录/注册 ASP.NET Web API 2.0 和 Identity 期间从 Facebook 检索其他配置文件信息

    似乎有很多关于如何使用 ASP NET Identity 和 MVC 客户端从 Facebook 配置文件获取附加信息的文档 但我似乎找不到任何关于如何从 Web API 控制器访问附加信息声明的信息 我的 Startup Auth cs
  • 为什么在 forEach 循环中不会追加列表项?

    我有一个简单的 forEach 循环 其中我尝试将列表项附加到无序列表中 但是 当我运行脚本时 我只看到添加了一个列表项 谁能解释为什么会发生这种情况 JS let bookElement document getElementsByCla
  • 如何在C#中使用文本框搜索列表视图的项目

    我有一个列表视图名称listView1 它包含计算机ID和它们的一些信息 所以我想做的是我有一个文本框名称过滤框 当我写东西时它会过滤它 它工作得很好 我的问题是它只是寻找第一列不是其他列 例如 PCNAME USER MODEL AAAA
  • 知道类中的所有变量是否为空的最佳方法是什么?

    这意味着类已初始化 但变量尚未设置 示例类 public class User String id null String name null public String getId return id public void setId
  • Groovy 不在集合中

    在 Groovy 中检查列表是否包含某些内容的惯用方法是使用in if b in a b c 但是如何很好地检查某些内容是否不在集合中呢 if g in a b c 使用逻辑看起来并不混乱 不经意的一瞥是隐藏的 在 Groovy 中是否有更
  • 如何从 ion-searchbar 获取输入?

    这是超级简单的问题 但我似乎无法弄清楚这一点 是的 我已经阅读了文档 我正在尝试获取用户输入的内容ion searchbar 在 Ionic v4 中 在他们按搜索并放入 const let 后 麻哈HTML
  • 带有 std::thread 和 std::chrono 的基本计时器

    我正在尝试使用经典方法来实现一个基本计时器 start 和 stop 我将 c 11 与 std thread 和 std chrono 一起使用 启动方法 创建一个在给定间隔时间内休眠的新线程 然后执行给定的 std function 当
  • 设置 UIView 的背景颜色会增加内存使用量

    我正在将许多 UIView 加载到 UIScrollView 上 并试图找出它们使用这么多内存的原因 经过使用 Instruments 的排除过程后 我发现设置视图的背景颜色会增加 4 倍的内存使用量 如果我不设置背景颜色 内存使用量约为
  • 上传到firebase时如何防止重复图像?

    当我想将图像上传到 firebase 实时数据库和存储 时遇到一些问题 在实时数据库中 我的图像对象默认有一张图像 并且当我上传其他图像时我不想覆盖图像所以我使用了传播运算符 SO 当我选择时一张图片并单击上传它们 它可以工作并保存 没有重
  • 更新列表列表中的属性

    问题是 如何在不循环的情况下更新 allItems 内的 ItemCount 字段 例如使用 Linq 例如 如果 Index 0 我想将 ItemCount 设置为 ItemCount 5 您可以看到下面的代码 我有以下课程 public
  • 尝试使用 LEFT OUTER JOIN 优化 MySQL 查询

    我有这个查询 它工作正常 只是需要很长时间 7 秒 jobs 表中有 40k 条记录 wq 表中有 700k 条记录 我尝试了 EXPLAIN 它说它查看作业表中的所有记录 并且不使用任何索引 我不知道如何告诉 MySQL 在查找 wq 表
  • 淘汰赛验证插件自定义错误消息

    根据以下内容 我到底如何设置回调以显示自定义错误消息而不是默认消息 ko validation rules exampleAsync async true the flag that says Hey I m Async validator
  • Pyaudio:将输入连接到输出时出错

    我正在 Intel Edison 主板上尝试 pyaudio 但它在内置测试中失败了 单独录音和播放在我的设置中工作得很好 但如果我尝试将输入连接到输出 则会出现错误 文件 wire full py 第 33 行 位于 data strea
  • 将子组件的配置传递给父组件

    通常 要定义网格类型 我会执行以下操作 Ext define MyApp view MyGrid extend Ext grid Panel alias widget myGrid store MyStore columns 然后我通过其
  • 如何在iOS App Store Sandbox中测试自动续订订阅的“续订”组件?

    Folks 我正在尝试验证自动续订订阅是否确实在沙盒环境中续订 首先 沙盒中的自动续订订阅似乎只有 5 分钟的有效期 说得通 我预计如果我等待五分钟 然后再拨打 https sandbox itunes apple com verifyRe
  • NSString 为空

    如何测试 NSString 是否为空 或全部空白或为零 通过单个方法调用 你可以尝试这样的事情 implementation NSString JRAdditions BOOL isStringEmpty NSString string i
  • 如何有效地对Delta表进行分区?

    在将数据帧存储在增量表中时 为我的数据帧寻找有效的分区策略 我当前的数据帧 1 5000 000 rowa 将数据从数据帧移动到增量表需要 3 5 小时 为了寻找一种更有效的方法来完成此写作 我决定尝试表中的不同列作为分区列 我搜索了列的基
  • Moment js - 显示距离日期还有几天和几小时

    我正在开发一个项目 需要对日期对象进行这种文本响应 1天7小时路程 需要这样 而不是 距离 31 小时 或 距离 1 天 我也在使用 moment js 因为我正在英语和德语之间进行语言切换 所以我已经利用了 moment js 语言区域设