Angular Translate: использование .replace в строке интерполяции в HTML

Я пытаюсь объединить интерполяцию и угловой перевод, чтобы получить языковые переводы с en -> fr из пары файлов json. Все определения определены, однако для отображения интерполированной строки в HTML это выглядит так:

{{ 'this.section.in.json.' + object.param | translate}}

поэтому он примет параметр в виде строки, найдет его в en.json и, если параметр французский, найдет перевод в fr.json. Моя проблема в том, что Object.param исходит из API, и в нем есть пробел, а json структурирован по-другому:

Need param with no spaces--> "thisString": "this String" <--Object.Param returns this

Я могу определить функцию в моем компоненте, чтобы использовать .replace() и возвращать новое значение, но есть много разных переводов, с которыми нужно иметь дело для множества разных параметров. Есть ли способ использовать .replace в строке интерполяции в файле html? как показано ниже

{{ 'this.section.in.json.' + object.param.replace(*regex*, '') | translate}}

person Haq.H    schedule 22.03.2018    source источник
comment
да, вы можете использовать функцию Javascript, но не глобальные переменные функции JavaScript, такие как окно, документ и т. д.   -  person Yasir Shabbir Choudhary    schedule 15.09.2018


Ответы (2)


Я бы просто сделал новую трубу, которая удаляет пробелы. Просто не забудьте зарегистрировать его в своем модуле приложения.

import { Component, Pipe, PipeTransform } from '@angular/core';

@Pipe({ name: 'stripSpaces' })
export class StripSpaces implements PipeTransform {
  transform(str: string): any {
    return str.replace(/\s/g, '')
  }
}

Затем в вашем шаблоне используйте это

  {{ 'this.section.in.json.' + object.param | stripSpaces | translate }}
person Matt    schedule 22.03.2018
comment
Оба ответа работают хорошо, но этот более полный. Несмотря ни на что, спасибо вам обоим~ - person Haq.H; 22.03.2018

Нет, вы не можете использовать эти функции-методы непосредственно в контексте интерполяции. Но вы можете связать трубы. Это означает, что вы можете сначала написать свой собственный канал для удаления этих пробелов, а затем применить свой перевод.

e.g.:

{{ 'this.section.in.json.' + object.param | removeWhitespaces | translate}}

Здесь вы сначала удаляете пробелы, а затем переводится «очищенная» строка.

person Lynx 242    schedule 22.03.2018