时间戳

首页 > 解决方案 > 如何使用 ngx-translate 将变量传递给 ngFor？

angular - 如何使用 ngx-translate 将变量传递给 ngFor？

问题描述

我正在尝试遍历来自 ngx-translate 的翻译文件的键/值 json 对象。

这工作正常：

<div *ngFor="let item of 'gallery.01.images' | translate | keyvalue">
    <p>{{item .key}}:{{item .value}}</p>
</div>

但是如果我想在可迭代对象中包含一个变量，它会在下面抛出错误：

<div *ngFor="let item of 'gallery.{{id}}.images' | translate | keyvalue">
    <p>{{item .key}}:{{item .value}}</p>
</div>

错误

emplate parse errors: Can't bind to '*ngFor' since it isn't a known property of 'div'

i18n/en.json

{
    "gallery": {
        "01: {
            "images": ["001", "002", "003"]
        },
        "02: {
            "images": ["006", "009"]
        }
    }
}

标签： angularangular7ngx-translate

解决方案

using{{ }}仅用于在访问变量时显示数据。如果你想遍历一个通用数组，你可以这样做：

<div *ngFor="let item of myCustomArray | translate | keyvalue">
    <p>{{item .key}}:{{item .value}}</p>
</div>

如有任何问题。随意问:)

推荐阅读