UNPKG

ngx-translate-formatjs-compiler

Version:

[Format.js](https://formatjs.io/) based [@ngx/translate](https://github.com/ngx-translate/core) compiler.

45 lines (32 loc) 1.88 kB
# ngx-translate-formatjs-compiler [![Node.js CI](https://github.com/stefanseeger/ngx-translate-formatjs-compiler/actions/workflows/node.js.yml/badge.svg)](https://github.com/stefanseeger/ngx-translate-formatjs-compiler/actions/workflows/node.js.yml) [![npm version](https://badge.fury.io/js/ngx-translate-formatjs-compiler.svg)](https://badge.fury.io/js/ngx-translate-formatjs-compiler) [![CodeQL](https://github.com/stefanseeger/ngx-translate-formatjs-compiler/actions/workflows/codeql-analysis.yml/badge.svg)](https://github.com/stefanseeger/ngx-translate-formatjs-compiler/actions/workflows/codeql-analysis.yml) [Format.js](https://formatjs.io/) based [@ngx/translate](https://github.com/ngx-translate/core) compiler. Supports Angular >= 10 ## Install `npm i --save intl-messageformat @ngx-translate/core ngx-translate-formatjs-compiler` ## Integration in @ngx/translate/core ```ts import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { TranslateCompiler, TranslateModule } from '@ngx-translate/core'; import { TranslateFormatJsCompiler } from 'ngx-translate-formatjs-compiler'; import { AppComponent } from './app'; @NgModule({ imports: [ BrowserModule, TranslateModule.forRoot({ compiler: { provide: TranslateCompiler, useClass: TranslateFormatJsCompiler, }, }), ], bootstrap: [AppComponent], }) export class AppModule {} ``` ## Troubleshooting - With FormatJS HTML tags must be escaped with a `'` in the translation. E.g. `'<h1>'Your content goes here'</h1>'` - With FormatJS interpolation variables are surrounded by single brackets. E.g. `I am having {count} cats` ## Further links - [Supported Syntax](https://formatjs.io/docs/core-concepts/icu-syntax) - [ICU Online Editor](https://format-message.github.io/icu-message-format-for-translators/editor.html)