Arrays 手柄显示数组中的项目列表_Arrays_Handlebars.js

Arrays 手柄显示数组中的项目列表

arrays

Arrays 手柄显示数组中的项目列表,arrays,handlebars.js,Arrays,Handlebars.js,我有以下文档，我需要使用手柄将值传递到模板中。我已经设法显示了所有的值，除了那些我似乎无法访问的reps和kilos的值。如何编写模板代码以达到这些值？我想把它们成对地打印出来，所以reps[0]和kilos[0]等等 { "personId": "Mario", "date": "7-10-2014", "workout": { "exercise": "Military Press", "musclegroup": "Shoulders", "sets"

我有以下文档，我需要使用手柄将值传递到模板中。我已经设法显示了所有的值，除了那些我似乎无法访问的

reps

和

kilos

的值。如何编写模板代码以达到这些值？我想把它们成对地打印出来，所以

reps[0

]和

kilos[0]

等等

{
  "personId": "Mario",
  "date": "7-10-2014",
  "workout": {
    "exercise": "Military Press",
    "musclegroup": "Shoulders",
    "sets": [
      {
        "reps": [
          "20",
          "30"
        ],
        "kilos": [
          "22",
          "33"
        ]
      }
    ]
  }
}

这是我目前的模板

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset = "utf-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">

  <!-- CSS Stylesheets -->
  <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="./../../static/styles/main.css">


  <!-- Adding google fonts -->
  <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:300|Satisfy' rel='stylesheet' type='text/css'>

  <!-- Scripts -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

</head>

<body>
    <!-- Title & logo -->
    <div id="header">
      <h1><i class="fa fa-book"></i> loGym</h1>
    </div>

    <!-- Main body of page -->
    <main role=”main”>

        <div id="content">
            <h2><strong>Workout</strong></h2>

            {{#if content}}
              {{#content}}
                <p><strong>Date</strong> - {{date}}</p>
                <p><strong>Muscle Group</strong> - {{workout.musclegroup}}</p>
                <p><strong>Exercise</strong> - {{workout.exercise}}</p>
                <p><strong>Sets</strong></p>
                    <ul id="setList">
                      {{#sets}}

                      <li>Reps: {{reps}} - KG: {{kilos}}</li>
                      {{/sets}}
                    </ul>
                {{/content}}
            {{else}}
                <p>There are not documents avalable.</p>
            {{/if}}
        </div>

        <form>
          <input type="button" id="homeButton" class="buttons" value="Home Page" onclick="window.location.href='/'">
        </form>

    </main>

</body>
</html>


洛格姆
锻炼
{{#如果内容}
{{{#内容}
日期-{Date}
肌肉群-{{workout.musclegroup}
锻炼-{{workout.Exercise}
设置

{{#集}
Reps:{{Reps}-KG:{{kilos}
{{/集}

{{/content}
{{else}
没有可用的文档
{{/if}

您需要使用{{{each}}和{{this}}语句。不是100%确定你想要的格式，但是这里有一个简单的例子

{{#if content}}
          {{#content}}
            <p><strong>Date</strong> - {{date}}</p>
            <p><strong>Muscle Group</strong> - {{workout.musclegroup}}</p>
            <p><strong>Exercise</strong> - {{workout.exercise}}</p>
            <p><strong>Sets</strong></p>
                <ul id="setList">
                  {{#sets}}

                  <li>Reps: {{#each reps}}{{this}}{{/each}} - KG: {{#each kilos}}{{this}}{{/each}}</li>
                  {{/sets}}
                </ul>
            {{/content}}
        {{else}}
            <p>There are not documents avalable.</p>
        {{/if}}

{{{#if content}
{{{#内容}
日期-{Date}
肌肉群-{{workout.musclegroup}
锻炼-{{workout.Exercise}
设置

{{#集}
代表：{{{{每个代表}{{这个}{{/每个}}-KG:{{{{每个公斤}}{{这个}{/每个}}}
{{/集}

{{/content}
{{else}
没有可用的文档
{{/if}

仍然不输出值。调用

设置时，我缺少训练
标识符。所以它应该是{{{{count.sets}
，而不是{{{count.sets}
。谢谢，现在开始工作了：）