Angular $ localize используя dynamici c идентификатор перевода - PullRequest
1 голос
/ 31 марта 2020

С новым Angular 9 @ angular / localize теперь можно переводить код прямо из машинописного текста. Поскольку его использование официально не задокументировано, я нашел несколько советов в этом посте .

$localize`:@@my-trans-unit-id:` // IT WORKS

. Это работает правильно, когда идентификатор передается в функцию, но если я хочу, чтобы идентификатор был будь динамичен c (и передай переменную), он не работает, рендеринг ID без разбора или перевода.

Я пробовал это, передавая переменную таким образом:

const id = "my-trans-unit-id";

$localize`:@@${id}:`; // NOT WORKING
$localize`:@@`+id+`:`; // NOT WORKING

1 Ответ

0 голосов
/ 08 мая 2020

Angular не предоставляет никакого механизма для генерации динамических c переводов, поскольку они генерируются во время компиляции.

В итоге я создал каналы и вызывал их каждый раз, когда мне нужен перевод. Вместо использования 1 уникальной инструкции для перевода строки, я использую несколько вызовов $localize внутри коммутатора для возврата правильного перевода по идентификатору.

Это пример перевода статуса заказа, который можно вызвать во время выполнения:

import { Pipe, PipeTransform } from '@angular/core';
import { OrderStatusEnum } from 'installation-status.enum';

@Pipe({
    name: 'orderStatusRenderer'
})
export class OrderStatusRendererPipe implements PipeTransform {
    constructor() {}

    transform(value: number, ...args: any[]): any {
        switch (value) {
            case OrderStatusEnum.PREPARING:
                return $localize`:@@order.status.preparing:`;
            case OrderStatusEnum.SHIPPED:
                return $localize`:@@order.status.shipped:`;
            case OrderStatusEnum.COMPLETED:
                return $localize`:@@order.status.completed:`;
        }
    }
}
...