我们可以使用Javascript在MVC中向用户显示本地日期时间吗？

Question

我需要在 .NET MVC 应用程序中使用 JavaScript 将 CET 中收到的日期时间显示为用户的本地时间。这怎么办？

function convertUtcToLocal() {
    document.querySelectorAll('[data-utc-time]').forEach(function (element) {
        const utcTime = element.getAttribute('data-utc-time');
        if (utcTime) {
            const localTime = new Date(utcTime).toLocaleString('en-GB', {
                year: 'numeric',
                month: '2-digit',
                day: '2-digit',
                hour: '2-digit',
                minute: '2-digit',
                hour12: false
            });
            element.textContent = localTime;
        }
    });
}

这是我尝试的代码，我为每个日期时间添加了一个类，并使用

ToUniversalTime()

获取 utc 时间，然后使用

ToLocaleString()

将 UTC 时间转换为用户的本地时间，但这不起作用

Answer 1

在 .NET MVC 视图中，将 UTC 时间呈现为数据属性。

<div class="utc-time" data-utc-time="@Model.UtcTime.ToString("yyyy-MM-ddTHH:mm:ss")"></div>

然后，在 JavaScript 代码中，从数据属性中检索 UTC 时间并将其转换为用户的本地时间

function convertUtcToLocal() {
document.querySelectorAll('.utc-time').forEach(function (element) {
    const utcTime = element.getAttribute('data-utc-time');
    if (utcTime) {
        const localTime = new Date(utcTime);
        const localTimeString = localTime.toLocaleString();
        element.textContent = localTimeString;
    }
});

然后调用 convertUtcToLocal();

在数据属性中渲染时，确保 UTC 时间的格式正确为 ISO 8601 格式 (yyyy-MM-ddTHH:mm:ss)。

Answer 2

确保输入正确且可解析。

这个正确地向我显示了荷兰中部夏令时间 14:48

const localTime = new Date('2024-04-02T12:48:00.000Z').toLocaleString('en-GB', {
  year: 'numeric',
  month: '2-digit',
  day: '2-digit',
  hour: '2-digit',
  minute: '2-digit',
  hour12: false
});
console.log(localTime)