Support for ng-model-options timezone

[PhilDore11]

Issue: Date is always displayed in local time Expected: ng-model should respect the ng-model-options

Code: <input mdc-datetime-picker date="true" time="false" type="text" format="MM/DD/YYYY Z" show-todays-date ng-model="date" ng-model-options="{ timezone: 'utc' }" />

[hexadecy]

@PhilDore11 yes it should, but the end result you want is a js date shifted to local utc or a moment utc?

I've made a special case when the ng-model is a moment utc. https://github.com/beenote/angular-material-datetimepicker/releases/tag/v.1.11.0

[hexadecy]

Can you have a look? before I make a version of it. https://github.com/beenote/angular-material-datetimepicker/commit/77d4ccd0fcf188c5fdfc17dbd71b76c721a37c1d

You need at least angular 1.6

[ajmueller]

@PhilDore11 @hexadecy this is such perfect timing as I really needed this in a project I'm working on. So thank you!!!

To help test, I've created a couple Plunkers to make sure this works and it seems to be working as expected. Here are the links:

1. Hard-coded Timezone - this uses hard-coded timezone values of UTC for the ng-model-options. I also include an example with Moment Timezone where you can set a default value for the picker on init of the controller.
2. Dynamic Timezone Abbreviations - this example allows you to dynamically change the timezone with a model value. It uses kcd-recompile to power the ng-model-options dynamically and Moment Timezone to figure out the appropriate abbreviation for ng-model-options. NOTE: since Angular's model options rely on offsets for timezones other than UTC and the continental US, the next example is probably the best one to use for most use-cases.
3. Dynamic Timezone Offsets - this example is the same as example 2, but uses timezone offsets instead of abbreviations. This will be best for those who need truly dynamic usage of timezone in ng-model-options since offsets are supported by Angular 1.6 for any timezone.

@hexadecy I plan on doing some more thorough testing in my own project and I'll post back results here. So far this is looking very promising, though. I can't thank you enough.

[hexadecy]

@ajmueller I added the Hard-coded Timezone test. You can run this project with nodejs lite-server and play with the index.html file if you like. Pre-release: https://github.com/beenote/angular-material-datetimepicker/releases/tag/v1.12.0

I normally remove the pre-release tag when I see no apparent bug in our dev/qa environment of Beenote.

[ajmueller]

@hexadecy it looks like the exSourceCode directive needs to be updated with ng-model-options support, unless I'm reading something wrong. Running the project at the v1.12.0 tag locally gives me this:

The example itself is working just fine, though.

[hexadecy]

Ok fixed here: https://github.com/beenote/angular-material-datetimepicker/commit/d249b57031a30118d3569562db0ff4063ccb9962

[hexadecy]

https://github.com/beenote/angular-material-datetimepicker/releases/tag/v1.13.0