L10n Service

Overview

The pipe or directive can’t cover all situations, some strings need to be processed in JavaScript module rather than in the template. L10nService provides APIs for translation related information in addition to pipe and directive.

API

Get source string

Will return source string in sourceBundle by key.

public getSourceString(key: string): string;

Check if the key exists in the resource

Determine whether the key exists in the source bundles or translations. If the locale is source locale, check whether the key exists in sourceBundles. If the locale is not source locale, check whether the key exists in translation.

public isExistKey(key: string, locale?: string ): boolean;

Register source bundle

The registerSourceBundles API is used to register the source strings on demand, such like, register source strings by component. By default, these source strings will be registered under the main configuration for root module or lazy module.

public registerSourceBundles(...args: sourceBundleObject[]);

If you want to flexibly specify the corresponding configuration to register, please call the underlying source registration api in the VIPService:

public registerSourceBundles(sourceBundles: sourceBundleObject[], config: VIPConfig);

Get formatted message

Get the formatted message of a key. This method is synchronous, you are responsible for knowing when your translations have been loaded, and it is safe to use this method. If you are not sure or you want to support locale live update, you should subscribe to stream API and consume this method in an observer.

public getMessage(key: string, variables?: string[]|{}, locale?: string): string;

Get scoped translate

Get scoped ‘getMessage’ for isolated module, through this closure the namespace is generated by the specific configuration as a prefix of key to distinguish the original key from the main module. The parameters of the generated function and the original ‘getMessage’ are the same.

public getScopedTranslate(config: VIPConfig): Function;

Stream API

Since the live update is relying on the observable object to notice the available current locale, formatting message based on the l10n service should be performed in the subscription of the ‘stream’ to ensure the resource is ready for this locale.

public stream(): Observable<string | any>;

Parameters

Example Code

// test.component.ts
import { L10nService, VIPService } from '@singleton-i18n/angular-client';
import { Component, OnInit, OnDestroy } from '@angular/core';


@Component({
    selector: 'test',
    templateUrl: './test.component.html'
})
export class TestComponent implements OnInit, OnDestroy {
    subscription: any;
    constructor(private l10nService: L10nService, private vipService: VIPService) {
        const sourceString = this.l10nService.getSourceString('Singleton.description');
        // register source bundles
        l10nService.registerSourceBundles(
            {'test': 'test string'},
            {'Singleton.description': 'Singleton for Angular client'}
        );

        // register source bundle for specific configuration
        vipService.registerSourceBundles(
            [ {'test': 'test string'},
              {'Singleton.description': 'Singleton for Angular client'} ],
            {
                productID: 'SingletonNgxSample',
                component: 'default',
                version: '1.0.0'
            }
        );
    }

    ngOnInit() {
        this.subscription = this.l10nService.stream.subscribe((locale: string) => {
            this.translation = this.l10nService.getMessage('Singleton.description', [ 'Singleton for Angular client' ], locale);
        });
    }
    ngOnDestroy() {
        this.subscription.unsubscribe();
        this.subscription = undefined;
    }
}