Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson

Already subscribed? Sign In

Autoplay

    New in Angular 1.3: ngModelOptions allows you to set a timezone on your model.

    Kent C. DoddsKent C. Dodds

    ngModelOptions in angular allows you to set several handy options of your ngModels, including the timezone for dealing with dates and times.

    angularjsAngularJS
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    00:01 Angular 1.3 comes with a new directive called ngModelOptions. It's very simple. You pass in an object. I've got that object here. It allows you to more finely tune your ngModel and how Angular deals with that model.

    00:15 One of the cool things that you can do with it is specify time zone. Currently, the only value that's valid for this property is UTC. Hopefully, in the future, more will be available, but this is what you have for right now.

    00:29 What this does is it allows the view and the model to have a different time zone. It only makes sense for a date or a time type. We'll change it from email to time, and then we'll set it here. 1:00 AM in UTC is translated in 18:00 in MST, which is my time zone.

    00:53 The actual bound value, the model's value, is set to my time zone, whereas the view value is set to the UTC time zone. If I were to take this out and go back to 1:00 AM, then it's 1:00 AM in my time zone. That's what the time zone property does, and that's one of the cool properties that are available in ngModelOptions.

    Discuss

    Discuss