私はi18nextを使用してウェブサイトをローカライズしています。/locales/dev/translation.jsonに次のものがあります。
"guide": {
"sections": {
"the-basics": {"title": "The Basics",
"contents": [{"title": "Introduction",
"content": {"p1": "", "p2": "", "p3": ""}}
,{"title": "A Chapter in the Zeitgeist Movement",
"content": {"p1": "", "p2": "", "p3": ""}}
]
}
,"setting-up-a-national-chapter": {"title": "Setting up a National Chapter",
"contents": [{"title": "Gathering Volunteers & Social Media",
"content": {"p1": "", "p2": "", "p3": ""}}
]
}
}
}
私のテンプレートは次のようなものです。
aside#nav-container(role="complementary")
nav#primary-nav.overview(role="nav")
- for(var i in items)
h3.section
span.menu-toggle
span(data-content=""+i data-i18n="guide.sections."+i+".title")=i18n.t("guide.sections."+i+".title")
ul.sub-section
- var contents = items[i].contents
- for(var c in contents)
li
- console.log(contents[c].title) // returns the correct item title
a.nav-link(href="#" data-content=""+c data-i18n="guide.sections."+i+".contents.title")=i18n.t("guide.sections."+i+".contents.title")
これは単に"guide.sections。"+i+"。contents.title"を返します
問題は、それ"guide.sections."+i+".contents"
が1つ以上のアイテムを持つオブジェクトであるということです。
コードを調べると、次のようになります。
<ul class="sub-section active"><li><a href="#" class="nav-link" data-content="0" data-i18n="guide.sections.the-basics.contents.title">guide.sections.the-basics.contents.title</a></li><li><a href="#" class="nav-link" data-content="1" data-i18n="guide.sections.the-basics.contents.title">guide.sections.the-basics.contents.title</a></li></ul>
有効にしました.sub-section.i18n()
i18nextに正しい翻訳アイテムを表示させる正しい方法は何ですか?
どんなアドバイスも大歓迎です。