ngx-flags

Angular component to show country flags.

Install

Install the package with NPM:

$ npm install ngx-flags

Import the module to app.module.ts:

import { NgxFlagsModule } from 'ngx-flags';

@NgModule({
  ...
  imports: [
    ...,
    NgxFlagsModule,
    ...
  ],
  ...
})

Add this lines to angular.json:

{
    ...
    "assets": [
        ...,
        {
            "glob": "**/*",
            "input": "./node_modules/ngx-flags/img/flags",
            "output": "./assets/flags"
        }
    ].
    ...
}

Usage

Use the tag flag with attribute country="xx" (where xx is the ISO 3166-1-alpha-2 code of a country):

<flag country="br"></flag>

Optional attributes

attribute	options	default	description
size	'xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl',	48	sets the flag width
format	'none', 'round', 'square'	'none'	sets the flag format
class			apply custom class to flag

Release notes

14.0.4 - 24-AUG-22

• [NEW] Added support for ENG (en), CRO (hr), URU (uy), DEN (dk), HON (hn), GER (de), and POR (pt).

14.0.0 - 22-AUG-22

• [NEW] country attribute can now use ISO 3166-1-alpha-3 code or the name of the country in several languages.
• [NEW] Support for Angular 14.

13.0.6 - 19-AUG-22

• [FIX] Fixed bug that prevented the flag to be shown under certain circumstances.

13.0.5 - 19-AUG-22

• [NEW] Added Wales (gb-wls, wls, wales)
• [FIX #2] Flag for GB/UK was mapped wrongly.