i18next-node issue with object item

i am using i18next to localize a website, on my /locales/dev/translation.json i have the following:

  "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": ""}}
                                    ]
                        }
    }
  }

and my template is like:

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")

this just returns "guide.sections."+i+".contents.title"

the issue is that "guide.sections."+i+".contents" is an Object with one or more items!

when i inspect the code, i get the following:

<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>

i have enabled .sub-section.i18n()

what is the correct way to make i18next display the correct translation item?

any advise much appreciated.

guide.sections.the-basics.contents.title will return the object {"p1": "", "p2": "", "p3": ""} only if you enable returning objects:

http://i18next.com/pages/doc_features.html#objecttree

to parse this object (multiple paragraphs) proper you will need to add a postprocessor converting the object to valid html:

http://i18next.com/pages/doc_features.html#postprocessing