Angularjs在不同時區顯示時間戳日期

只需使用date:'medium'即可正確顯示該時間戳的當地時間的選定時間戳。Angularjs在不同時區顯示時間戳日期

我想要實現的是在某個時區顯示此時間戳，例如UTC + 03：00或GMT + 03：00，以舉例說明。

我曾嘗試使用

日期： '中'： 'UTC + 03：00'

日期： '中'： 'UTC + 0300'

日期：」中等 '：' GMT + 03：00'

日期： '媒介'： 'GMT + 0300'

日期： '中'： '+ 03:00'

日期： '中'：'+ 0300'

這些都不會將時間戳時間更改爲該時區內的時間。

原因：顯示用戶首選時區設置的時間，即使他們當前位於具有其他時區的國家/地區。

有誰知道我如何正確顯示時間戳到指定的時區？

來源

2015-05-07 Yves Mertens

關於Javascript的重要知識是，所有對時區的引用指的是系統中執行代碼的時區，其中您無法控制。你甚至不能相信客戶端機器設置了正確的時區。所以當你選擇一個顯示時區的選項時，所有可以完成的事情都是給你客戶端的時區。

JavaScript中的時區可能會變得很複雜，這裏有一個，它有相當多的細節並提供解決方案。

處理時區的一種簡單方法是將所有日期存儲在UTC中，然後使用moment.JS庫格式化它們以顯示它們。假設您的所有時間都以UTC格式存儲，則可以使用類似this plunker中所寫的過濾器來格式化日期並將其操作爲用戶首選的時區。這裏只是樣品過濾件代碼：

// filter to set the timezone, assumes incoming time is in UTC 
angular 
    .module('plunker') 
    .filter('toUserTimezone', function() { 
    return function(input, format, offset) { 

     var output, timezoneText, inputCopy; 

     // we need to copy the object so we don't cause any side-effects 
     inputCopy = angular.copy(input); 

     // check to make sure a moment object was passed 
     if (!moment.isMoment(inputCopy)) { 
     // do nothing 
     return input; 

     } else { 
     // set default offset change to 0 
     offset = offset || 0; 

     // change the time by the offet 
     inputCopy.add(offset, 'hours'); 

     // this will need to be improved so the added text is in the format +hh:mm 
     offset >= 0 ? timezoneText = '+' + offset : timezoneText = offset; 

     // format the output to the requested format and add the timezone 
     output = inputCopy.format(format) + ' ' + timezoneText; 

     return output; 
     } 
    }; 
    });

的那一刻庫是相當不錯的，只要我有日期的工作，我會包含它，因爲它是小的。它也有一些非常強大的時區工具。您可以使用時區工具擴展上面的過濾器，以使其與DST以及偏移量不等於一小時的時區（如印度）一起工作。

更新：在看了時區庫之後，我們實際上可以簡化過濾器代碼。第一個解決方案更多的是破解，這個解決方案更加強大，因爲我們將保留原始時區數據。另外，我已將格式和時區轉換爲兩個單獨的過濾器。您可以在this plunker中看到演示。

這裏是轉換時區的過濾器：

angular 
    .module('plunker') 
    .filter('convertTimezone', function() { 
    return function(input, timezone) { 
     var output; 

     // use clone to prevent side-effects 
     output = input.clone().tz(timezone); 

     // if the timezone was not valid, moment will not do anything, you may 
     // want this to log if there was an issue 
     if (moment.isMoment(output)) { 
     return output; 
     } else { 
     // log error...  
     return input; 
     } 
    }; 
    });

的時區庫允許您將字符串傳遞到moment.tz（）方法，如果該字符串被稱爲轉換會發生，如果不是無將作出更改。克隆（）方法是防止使用angular.copy的副作用的一種更好的方法，就像我以前那樣。

現在，這裏是新的格式，濾鏡，與前：

angular 
    .module('plunker') 
    .filter('formatTime', function() { 
    return function(input, format) { 

     // check to make sure a moment object was passed 
     if (!moment.isMoment(input)) { 
     // do nothing 
     return input; 
     } else { 
     return input.format(format); 
     } 
    }; 
    });

綜上所述，當下時區圖書館是非常有用的！

來源

2015-05-07 22:04:10 Graham

謝謝，這看起來不錯！你是否可以說例如在偏移量中傳遞「歐洲/都柏林」，然後像在時區選擇中一樣計算該值的偏移量？ –

答案是可以的，如果你使用moment.JS時區庫。查看我更新的新過濾器和新演示的答案。 – Graham

謝謝！它看起來非常棒！ –

按照角文檔：

時區

的角度日期時間過濾器使用瀏覽器的時區設置。相同的應用程序將顯示不同的時間信息，具體取決於運行應用程序的計算機的時區設置。目前的JavaScript和Angular都不支持在開發人員指定的時區顯示日期。

你看看momentjs和/或angular-moment？

來源

2015-05-07 11:51:57 user3632710

我看了一下https://docs.angularjs.org/api/ng/filter/date，它說你可以選擇一個時區。不，我還沒有看過momentjs和/或angular-moment，但我會的。 –

Angularjs在不同時區顯示時間戳日期

回答

相關問題