Timezone select for AngularJS

A simple AngularJS directive to create timezone select. It uses select2 to create auto-complete timezone select. Timezone information comes from moment. Countries timezone data comes from TimezoneDB.

In the dropdown, timezones are divided into three groups:

• UTC - UTC is a common option for most users.
• Common - Timezones for a country
• Other - Other timezones

If the user has already selected the country, timezones for the country will be listed first, which makes easier for user to select.

Install

Install angular-timezone-select using Bower bower install angular-timezone-select.

Usage

Make your Angular module depend on module angular-timezone-select.

angular.module('timezoneSelectExample', ['angular-timezone-select']);

Then use directive timezone-select.

<select timezone-select data-ng-model="timezone" country="country"><select>

Attribute country can be used to bind user's selected country. Value of selected country should be the ISO 3166-1 alpha-2 code, e.g. CN, US.

Example

See live example below or check out example.html.