angular-country-picker
AngularJS directive to generate a list of countries as options of the select element.
Installation
You can install the directive using Bower:
$ bower install angular-country-picker
Or npm:
$ npm install angular-country-picker
Then you have to include it in your HTML:
<script src="bower_components/angular-country-picker/country-picker.js"></script>
<script src="node_modules/angular-country-picker/country-picker.js"></script>
And inject the module puigcerber.countryPicker
as a dependency of your application:
angular.module('webApp', ['puigcerber.countryPicker']);
Usage
The directive is intended to be used as an attribute of the native select directive setting its ngOptions. Therefore ngModel
is required for this to work.
<select ng-model="selectedCountry" pvp-country-picker></select>
Excluding ngOptions
, any other optional attribute of the select directive could still be used.
<select name="country" ng-model="selectedCountry" pvp-country-picker ng-change="onChange()" required></select>
The default value to which ngModel
is bound it's the two-letter country code, but this can be changed setting the attribute to one of the following values:
- alpha2: two-letter country code defined in ISO 3166-1 alpha-2.
- alpha3: three-letter country code defined in ISO 3166-1 alpha-3.
- numeric: three-digit country code defined in ISO 3166-1 numeric.
- name: the English name of the country.
<select ng-model="selectedCountry" pvp-country-picker="name"></select>
Config
The country provider can be configured to set a custom list of countries.
angular.module('webApp', ['puigcerber.countryPicker'])
.config(function(pvpCountriesProvider) {
pvpCountriesProvider.setCountries([
{ name: 'Abkhazia', alpha2: 'AB'},
{ name: 'Kosovo', alpha2: 'XK'},
{ name: 'Nagorno-Karabakh', alpha2: 'NK'},
{ name: 'Northern Cyprus', alpha2: 'KK'},
{ name: 'Somaliland', alpha2: 'JS'},
{ name: 'South Ossetia', alpha2: 'XI'},
{ name: 'Transnistria', alpha2: 'PF'}
]);
});
See also
ISO 3166 is the International Standard for country codes and codes for their subdivisions. Currently 249 countries, territories, or areas of geographical interest are assigned official codes in ISO 3166-1.