Html5: {{data}} 放置在来自 json 文件的文本中间答案

【问题标题】：Html5: {{data}} to be placed in middle of text coming from json fileHtml5: {{data}} 放置在来自 json 文件的文本中间
【发布时间】：2019-01-29 23:59:40
【问题描述】：

我有一个关于 html 和 angular5 的问题。

<span [innerHTML]="'client.acceptance.explanation'| translate"></span>
<span><b>{{data}}</b></span>

此处的“client.acceptance.explanation”文本位于 json 文件中，并且正在获取数据并将其附加到文本中。例如，如果我的文字是：尊敬的 {{data}}，请确认您已准备好审核。现在我想在我的文本中间获取数据。所以一半文本在 {{data}} 之前，一半文本在它之后。那么我将如何在 html5 中指定呢？

【问题讨论】：

也许你必须将你的文本分成两部分（在你的 JSON 文件中），特别是如果你使用翻译管道：{{part1 | translate}} {{data}} {{part2 | translate}}
您也可以通过另一个自定义管道依靠良好的 ole' 字符串替换。比如：'client.acceptance.explanation'| translate | replace:{data: data}
你使用什么库翻译库？

标签： json angular html

【解决方案1】：

您可以使用管道将流程分为两个步骤：
1.翻译来自json文件的文本
2. 将翻译后的数据作为格式化管道的输入，以生成最终文本。

查看以下代码：
HTML：

管道：

@Pipe({
  name: 'formatData'
})
export class FormatDataPipe implements PipeTransform {

  transform(input: string) {
    return `Dear ${{ input }}, Please confirm your are ready to review`;
  }
}

【讨论】：