Question

我希望能够在这个json上使用每个帮助器，但是我无法显示子数组。我尝试了一切，但没有任何作用。我对此很陌生，但只是因为被困在这部分而感到沮丧

HTML

<head>
  <title>tally</title>
</head>

<body>
  <h1>Welcome to Meteor!</h1>

  {{> hello}}

    {{#each artist }}
        <h2>{{ name }}</h2>
        <h3>{{ proDate }}</h3>

    <b>Songs</b>: {{#each video}}
                    {{songs}}

                    {{/each}}



    {{/each}}


</body>

的javascript

    if (Meteor.isClient) {
    Template.body.helpers({
        artist: [
            {
                "name": "El Alfa",
                "proDate": 2008,
                "albums": 0,
                video: [{
                    "song": "Muevete Jevi",
                    "youtube": "https://www.youtube.com/embed/bnlW-42_Sfs"

                }]
            }]
    });
}

Answer 1

在meteor助手中与模板相关联。在你的问题中，html中没有模板。所以，我对此感到有点困惑。你可以参考流星的官方documentation。我也是流星技术的新手。到目前为止，我用两种方式使用帮助器：

helper用于特定模板。
helper。

为了更好地理解：

<强> HTML

<template name="myTemplate">
    {{#each artist}}
        <h3>Name : {{name}}</h3>
        <h4>proDate{{proDate}}</h4>
        <h4>{{albums}}</h4>
        Songs:
        <ul>
            {{#each video}}
                <li>{{song}} - {{youtube}}</li>
            {{/each}}
        </ul>
        <hr>
    {{/each}}
</template>

js （特定模板的heplers）

Template.myTemplate.helpers({
    artist : function(){
        return [
        {
            "name": "El Alfa 1",
            "proDate": 2007,
            "albums": 0,
            video: [{
                    "song": "Muevete Jevi 11",
                    "youtube": "https://www.youtube.com/embed/bnlW-42_Sfs/11"
                },
                {
                    "song": "Muevete Jevi 12",
                    "youtube": "https://www.youtube.com/embed/bnlW-42_Sfs/12"

                }
            ]
        },
        {
            "name": "El Alfa 2",
            "proDate": 2008,
            "albums": 1,
            video: [{
                "song": "Muevete Jevi 21",
                "youtube": "https://www.youtube.com/embed/bnlW-42_Sfs/21"

            },
            {
                 "song": "Muevete Jevi 22",
                 "youtube": "https://www.youtube.com/embed/bnlW-42_Sfs/22"

            }]
        }]
     }
});

OR 我们可以为所有模板编写帮助器。即。

Template.registerHelper("artist", function () {
    return [...] // same JSON as above
});

请在评论中随意提出疑问。

干杯。：）

Answer 2

对于您定义的JSON结构，它应如下所示：

{{#each artist }}
    <h2>{{name}}</h2>
    <h3>{{proDate}}</h3>

    <b>Songs</b>: 
    {{#each video}}
        <p>
            Song: {{song}}
            Link: {{youtube}}
        </p>
    {{/each}}

{{/each}}

Answer 3

你直接打电话给歌，Blaze不知道该怎么做。以下是您调用示例中引用的歌曲的方法：

{{#each artist}}
  <h2>{{name}}</h2>
  <h3>{{proDate}}</h3>

  <b>Songs</b>: 
  {{#each video}}
    <p>{{song}}</p>
    <p>{{youtube}}</p>
  {{/each}}
{{/each}}

如果你想使用它看起来像它的助手。您需要使用>符号引用它。

{{> song}}

官方Meteor page上有一个很棒的简洁例子。

if (Meteor.isClient) {
  // This code only runs on the client
  Template.body.helpers({
    tasks: [
      { text: "This is task 1" },
      { text: "This is task 2" },
      { text: "This is task 3" }
    ]
  });
}

<body>
  <div class="container">
    <header>
      <h1>Todo List</h1>
    </header>

    <ul>
      {{#each tasks}}
        {{> task}}
      {{/each}}
    </ul>
  </div>
</body>

<template name="task">
  <li>{{text}}</li>
</template>

如何在Meteor js中显示json的每个项目？

3 个答案: