Angular 6 - Как извлечь перевод из машинописи - PullRequest
Новая
       38

Angular 6 - Как извлечь перевод из машинописи

0 голосов
/ 25 сентября 2018

Я использую Angular 6, и у меня настроена обработка переводов в соответствии с документацией, найденной здесь: https://angular.io/guide/i18n.

Проблема в том, что документация не объясняет, как получать переводы с использованием машинописи.

Здесь есть похожий вопрос: Могу ли я использовать Angular i18n для перевода строковых литералов в машинописный код

Но я не могу использовать этот ответ, так как он опирается на ngx-translate, который будетустарел после того, как Angular догоняет, см. https://github.com/ngx-translate/core/issues/495.

Итак, используя Angular 6 i18n - как бы я получить переведенный текст, используя машинопись на основе, например, идентификатора?

1 Ответ

0 голосов
/ 25 сентября 2018

@ Diemauerdk, документация не объясняет, как получить переводы с использованием машинописи, потому что это невозможно.Обходной путь может иметь несколько переводов.Это 

//file locale-us.ts
export const translation:any={
   greeting:"Hello World!",
   mainTitle:"The best Appliacion of the world"
}
//file locale-es.ts
export const translation:any={
   greeting:"¡Hola Mundo!",
   mainTitle:"la mejor aplicación del mundo"
}

В ваших .ts вы можете иметь трубу 

import { Pipe, PipeTransform } from '@angular/core';
import { translation } from '../../i18n/locale-us';


@Pipe({ name: 'translation' })
export class TranslationPipe implements PipeTransform {
    constructor() {}
    transform(value: string): string {
        return translation[value] || null;
    }
}

И вы можете использовать в компоненте, где вы вводите трубу в конструктор, например, 

constructor(private translate: TranslationPipe){}
//And use like

alert(this.translate.transform('greeting'));

Тогда вы можете использовать отдельные "fileReplacements" в angular.json.Не показывать все angular.json, где вы должны добавить fileReplacement.У вас есть fe.g.об этом, если вы скачаете i18n пример документации https://angular.io/guide/i18n#internationalization-i18n

  "configurations": {

   "production": {
        ...
    },
    "production-es": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.prod.ts"
        }, //add this two lines
        {
          "replace": "src/i18n/locale-us.ts",
          "with": "src/i18n/locale-es.ts"
        }
      ],
      ...
      "outputPath": "dist/my-project-es/",
      "i18nFile": "src/locale/messages.es.xlf",
      ...
    },
    "es": {
      //And add this too
      "fileReplacements": [
        {
          "replace": "src/i18n/locale-us.ts",
          "with": "src/i18n/locale-es.ts"
        }
      ],
      ...

     "outputPath": "dist/my-project-es/",
      "i18nFile": "src/locale/messages.es.xlf",
      ...
    }
  }
...