【问题标题】:Nunjucks iterate over items in an array to display items in objectNunjucks 遍历数组中的项目以显示对象中的项目
【发布时间】:2016-09-21 20:47:37
【问题描述】:

在 javascript 中,我可以遍历一个数组以输出我的对象,如下所示。

var myArr = ["one","two","three"]
var myObj = {
  "one": {
    "title": "ones",
    "desc": "this is one"
  },
  "three": {
    "title": "threes",
    "desc": "this is three"
  },
  "two": {
    "title": "twos",
    "desc": "this is two"
  }
}

myArr.forEach(function (value) {
  console.log(myObj[value].title, myObj[value].desc);
});

输出

ones this is one

twos this is two

threes this is three

console.log("number 2 - ",myObj[myArr[1]].desc)
console.log("number 2 - ",myObj["two"].desc)

输出

number 2 - this is two

number 2 - this is two

我希望能够在 nunjucks 中执行此操作,因为我想控制来自 myArr 的显示顺序,但也希望能够灵活地拥有一个页面,例如 one.html,我可以在其中专门定位一个页面,例如{{testObj.one.title}}.

nunjucks 如何做到这一点?我已经尝试了以下方法。

-- nunjucks --
<ul>
  {% for item in testArr %}
    <li>{{item}} - {{testObj.one.title}}</li>
  {% endfor %}
</ul>

<ul>
   {% for obj, item in testObj %}
      <li>{{ obj }}: {{ item | dump }} - {{ item.title }} - {{ item.desc }}</li>
   {% endfor %}
</ul>

--- output ---
<ul>
  <li>one - ones</li>
  <li>two - ones</li>
  <li>three - ones</li>
</ul>

<ul>
  <li>one: {"title":"ones","desc":"this is one"} - ones - this is one</li>
  <li>three: {"title":"threes","desc":"this is three"} - threes - this is three</li>
  <li>two: {"title":"twos","desc":"this is two"} - twos - this is two</li>
</ul>

我的理想输出如下所示,我可以根据myArr 订购我的显示器,但对于每个项目,在myObj 中显示其键的内容

<ul>
  <li>one - ones</li>
  <li>two - twos</li>
  <li>three - threes</li>
</ul>

【问题讨论】:

    标签: javascript arrays json static-site nunjucks


    【解决方案1】:
    <ul>
      {% for item in myArr %}
        <li>{{item}} - {{myObj[item].title}}</li>
      {% endfor %}
    </ul>
    

    ?

    【讨论】:

    • 感谢您的帮助!我以为我已经尝试过类似的方法,这已经按预期工作了。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-02-18
    • 2016-11-18
    • 2018-02-13
    • 2015-12-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多