Hur översätter man Typescript-strängar i en Angular 2-app?


Jag känner till två stora plattformar för Angular 2 i18n: det officiella sättet och ng2-translate. Jag är mycket mer benägen att använda det som de officiella dokumenten rekommenderar. För mig är det mycket tydligt hur man översätter HTML-strängarna. Men det finns en sak jag inte har förstått än: Hur översätter man Typescript-strängarna?

Till exempel har jag följande komponent som använder den inbyggda i18n-lösningen:

import { Component } from '@angular/core';

@Component({
    moduleId: module.id,
    selector: 'hello',
    template: `
        <h1 i18n>Hello {{name}}!</h1>
        <button (click)="notify()"></button>
    `
})
export class HelloComponent {

    private name = 'John Doe';

    notify() {
        /* How do I translate this? */
        alert(`Hello ${this.name}!`);
    }
}

Strängen som placeras i HTML kommer att översättas. Men hur översätter jag strängen som visas i alerten? Om det inte finns ett inbyggt sätt, vad skulle vara det rekommenderade sättet att uppnå detta?

Svar #1

Angular-teamet är mycket fokuserat på att skapa en kärnprodukt med några ytterligare tjänster som andra kan använda om de vill (routing, translations, osv). Så nedvärdera inte några bibliotek som skapats av communityn, det är det som gör Angular så användbart!

Det sagt, jag rekommenderar starkt ng2-translate för dina behov. Du kan förladda översättningar, kalla dem synkront eller asynkront, och använda det som en pipe i en mall eller via en tjänst i dina komponentklasser.