时间戳

首页 > 解决方案 > angular: 使用 ngx-translate 翻译模板中对象数组的元素

arrays - angular: 使用 ngx-translate 翻译模板中对象数组的元素

问题描述

我一直在寻找如何使用模块 ngx-translate 转换对象数组的值的几个小时，这是我的代码的摘录，但我不知道如何实现 json 文件

模板 HTML：

 <div class="sort-header-container">
    <table matSort class="mat-sort">
      <tr *ngFor="let item of items" class="row">
        <td class="row">{{item.critere}}</td>
        <td>{{item.res}}</td>
      </tr>
    </table>
 </div>

服务中的对象数组：

items: any[] = [
    { critere: "Code-modèle", res: "Mizuno Shadow 4" },
    { critere: "Code Libellé", res: "KR32" },
    { critere: "Stock", res: 10 },
    { critere: "Prix TTC", res: "Bleu" },
    { critere: "Couleur", res: 42 },
    { critere: "Matière", res: 125 },
    { critere: "Zone", res: 100 },
  ];

我只需要翻译标准列

谢谢

标签： arraysangularngx-translate

解决方案

您需要使用TranslatePipefrom ngx-translate。

<div class="sort-header-container">
    <table matSort class="mat-sort">
      <tr *ngFor="let item of items" class="row">
        <td class="row">{{item.critere | translate}}</td>
        <td>{{item.res}}</td>
      </tr>
    </table>
 </div>

确保您的critere字段在 json 翻译文件中有相应的翻译

英文翻译示例：

{
  "Prix TTC": "Price",
  "Couleur": "Color",
}

推荐阅读