Как я могу перевести ввод с помощью ngx-translate?

Question

<input type="text" name="title" [(ngModel)]="dataAdd.titleEN">
<input type="text" name="title" [(ngModel)]="dataAdd.titleFR">  

Мне нужно показать два названия, но другой язык

Если я нажму кнопку, покажу текст на английском или покажу текст на французском

и сохранить в переменной строке

Примечание: мне нужна уникальная переменная для вставки уникальных данных в Firestore

    dataAdd = {
    titleEN: '',
    titleFR: '',
    }

    this.translateList = this.afs.collection('translates');
    this.translateList.doc('en').set({
    TITLE_FOR_RENT: this.dataAdd.titleEN,
    });

    this.translateList = this.afs.collection('translates');
    this.translateList.doc('fr').set({
    TITLE_FOR_RENT: this.dataAdd.titleFR,
    });

Answer 1

По моему мнению, вы ошибочно предположили использование ngx-translate, этот пакет используется для поддержки нескольких предопределенных языков, например, если вы хотите поддерживать en и fr, предварительно вы должны иметь .json файл для каждого желаемого языка со следующей структурой KvP => где ключ является универсальным ключом (некоторая строка, которая одинакова в каждом файле json), которая используется для сопоставления значений с переводами из .json файлы. Вы можете проверить официальную демонстрацию StackBlitz для подробного примера использования.

Чтобы получить результат, который вы описали, я бы предложил использовать что-то вроде Cloud Translation API, предоставляемого Google, которое может транслировать вводимые пользователем данные (или все, что вы передаете в API), после чего, в зависимости от вашей стратегии, вы можете отобразить ответ от API непосредственно клиенту или сначала загрузить его в ngx-translate, а затем отобразить его клиенту.

Замечания:

Я бы выбрал первый вариант, потому что я предполагаю, что в вашем случае заполнение памяти браузера не требуется (поскольку при загрузке корыта перевода в ngx-translate вы просто ощущаете один большой объект js за кадром)