【问题标题】:Angular translate : repeat on json object角度翻译:在 json 对象上重复
【发布时间】:2015-11-20 03:43:23
【问题描述】:

我有一个这样的 json 文件:

{
    "pages": {
        "page1": {
            "field1": "....",
            "field2": "....",
            "field3": "....",
            "thumbnails": [
                {
                    "illustration": "images/img.png",
                    "content": "...."
                },
                {
                    "illustration": "images/img.png",
                    "content": "...."
                },
                {
                    "illustration": "images/img.png",
                    "content": "...."
                }
            ]
        },
        ......

当我想在我的 html 中使用它时,我只是这样做:
{{ 'pages.page1.field1' | translate }} 例如

但是

如果我需要重复怎么办?对于缩略图。

<div ng-repeat="thumbnail in pages.page1.thumbnails">
      {{ thumbnail.content }}
</div>

但显然它不起作用。我不知道如何访问缩略图。

编辑 1:

我在我的配置中使用这样的“useStaticFilesLoader”:

$translateProvider.useStaticFilesLoader({
    prefix: 'assets/app_components/app/languages/emag_',
    suffix: '.json'
});

所以我的控制器中没有定义 json。

编辑 2 : 更准确地说,这是我真正想做的事情:为了帮助您了解我的问题,我在这里做了一些事情:http://plnkr.co/edit/mocztnQYvmmuc3Nslmnb?p=preview

【问题讨论】:

  • 您的 thumbnails 属性不是一个数组。您应该修复您的 JSON 文件以使其正常工作。据我所知,您的 HTML 代码没有任何问题。
  • @Julien,我认为我的问题在这里不一样。我不知道如何访问从角度翻译“useStaticFilesLoader”自动加载的json对象。
  • @ABr,你和 Mikos 是权利。我更改了我的 json 文件,但仍然......如何访问来自 angular translate "useStaticFilesLoader" 的 json 对象?我需要这样的东西:
  • 为了帮助您了解我的问题,我在这里做了一点小插曲:plnkr.co/edit/mocztnQYvmmuc3Nslmnb?p=preview

标签: angularjs angular-translate


【解决方案1】:

您有错误的 json 文件。您在对象中有对象。你需要数组。

试试这个。

{
"thumbnails": [
    {
        "illustration": "images/img.png",
        "content": "...."
    },
    {
        "illustration": "images/img.png",
        "content": "...."
    },
    {
        "illustration": "images/img.png",
        "content": "...."
    }
]

}

我认为 ng-repeat 仅适用于数组,因为 ng-repeat 需要知道长度。

抱歉英语不好:)

页面同样的问题。

{
    "pages": [
        {
            "fields": [
                "...",
                "...",
                "...."
            ],
            "thumbnails": [
                {
                    "illustration": "image/img_01.png",
                    "content": "...."
                },
                {
                    "illustration": "image/img_01.png",
                    "content": "...."
                },
                {
                    "illustration": "image/img_01.png",
                    "content": "...."
                }
            ]
        }
    ]
}

【讨论】:

  • 该死的。我累了,你说得对!我像你说的那样改变了它,但实际上我认为 ng-repeat 不能直接访问 json 文件。至少,我的代码不起作用。 &lt;div ng-repeat="vignette in pages.page1.vignettes" ..... 我没有包含 json 对象页面的控制器。它是从角度翻译自动加载的(参见“EDIT 1”)。
  • 我从不使用 useStaticFilesLoader 但你的 json 结构不好。你需要这个&lt;div ng-repeat="thumb in pages[1].thumbnails"&gt;... &lt;div ng-repeat="vignettein pages[1].vignettes"&gt;...
  • 是的,正如我在之前的评论中所说,我按照您所说的那样编辑了我的 JSON。带数组。现在我的 json 是正确的,我该怎么办?
  • 如果您需要知道您的应用可以访问 JSON 中的某个位置,只需键入 {{pages[1]}} 然后添加 {{pages[1].thumbnails}} 我需要第一个拇指的 url {{pages[1].thumbnails[1].url}} :) 并检查你的结果 :) link 在这里检查你的 JSON
  • 为了帮助您了解我的问题,我在这里做了一点小插曲:plnkr.co/edit/mocztnQYvmmuc3Nslmnb?p=preview
猜你喜欢
相关资源
最近更新 更多
热门标签