Angular2 and webpack - i18n plugin vs ng2-translate
I want to build a web-application with angular2 and bundle this with webpack. What is the best way for providing multiple languages:
i18n-plugin: https://github.com/webpack/i18n-webpack-plugin
or
ng2-translate: https://github.com/ocombe/ng2-translate
Answer
I got it working with webpack using the cookbook. The xliff file has to be converted to ts like so:
export const TRANSLATION_SV = `<?xml version="1.0" encoding="UTF-8" ?>
<xliff version="1.2" xmlns="urn:oasis:names:tc:xliff:document:1.2">
<file source-language="en" datatype="plaintext" original="ng2.template">
<body>
<trans-unit id="a73e2898b9e1126ed19dbabe4b5c3715a84db61a" datatype="html">
<source>Category</source>
<target>Kategori</target>
</trans-unit>
</body>
</file>
</xliff>`;Then in the main.ts it has to be added
import { TRANSLATIONS, TRANSLATIONS_FORMAT, LOCALE_ID } from '@angular/core';
import { TRANSLATION_SV } from './locale/messages.sv';
and inserted to the bootstrap step:
platformBrowserDynamic().bootstrapModule(AppModule, {
providers: [
{provide: TRANSLATIONS, useValue: TRANSLATION_SV},
{provide: TRANSLATIONS_FORMAT, useValue: "xlf"},
{provide: LOCALE_ID, useValue:'sv'}
];
});