替换表达式Angular 4中的字符串答案

【问题标题】：Replacing strings in expression Angular 4替换表达式Angular 4中的字符串
【发布时间】：2018-05-04 17:14:33
【问题描述】：

我有一个水果名称的 json 文件，就像

[
    { "fruits" : "orange"
    },
    { "fruits" : "apple"
    }
]

和角度正常

<div>{{fruits}}</div>

如何将结果中的字符串更改为其他单词，例如我希望橙色变成 orens 而苹果变成 apel 而无需修改 json 文件。我有30多个字要替换。

【问题讨论】：

标签： angular typescript

【解决方案1】：

这听起来像是管道的完美用例！

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

@Pipe({name: 'fruitMapper'})
export class FruitMapperPipe implements PipeTransform {
  transform(value: string): string {
    let result: string = value;
    // reassign result in a switch-block
    return result;
  }
}

然后在你的模板中

<div>{{fruits | fruitMapper}}</div>

【讨论】：

【解决方案2】：

您需要使用pipes。

查看documentation

【讨论】：