如何按照它们在对象中的顺序显示块



我使用https://handlebarsjs.com。这是我的模板:

<div class="container-description">
    <h2>Description</h2>
    <p>
        {{project.descriptions}}
    </p>
    {{#if comment}}
    <div class="comment-container">
        <div class="comment-preview">
            <dev class="message-comment">{{comment.comment}}</dev>
            <div class="comment-author">{{comment.name}}</div>
        </div>
    </div>
    {{/if}}
    <p>
        {{project.subDescriptions}}
    </p>
</div>

我得到一个对象:

{
    project: [
        "descriptions": "text",
        "name": "text",
        "comment": "text",
        "subDescriptions": "text"
    ]
}

它运行良好。

我的问题是,如果一个对象进来,则交换的字段。例如:

{
    project: [
        "descriptions": "text",
        "subDescriptions": "text",
        "name": "text",
        "comment": "text"
    ]
}
or 
{
    project: [
        "descriptions": "text",
        "name": "text",
        "comment": "text"
        "subDescriptions": "text"
    ]
}

然后模板应该像这样。

<div class="container-description">
    <h2>Description</h2>
    <p>
        {{project.descriptions}}
    </p>
    <p>
        {{project.subDescriptions}}
    </p>
    {{#if comment}}
    <div class="comment-container">
        <div class="comment-preview">
            <dev class="message-comment">{{comment.comment}}</dev>
            <div class="comment-author">{{comment.name}}</div>
        </div>
    </div>
    {{/if}}
</div>
or
<div class="container-description">
    <h2>Description</h2>
    {{#if comment}}
    <div class="comment-container">
        <div class="comment-preview">
            <dev class="message-comment">{{comment.comment}}</dev>
            <div class="comment-author">{{comment.name}}</div>
        </div>
    </div>
    {{/if}}
    <p>
        {{project.descriptions}}
    </p>
</div>

或类似的东西。

如何按照对象的顺序显示模板中的块?

{
    project: [
        "descriptions": "text",
        "name": "text",
        "comment": "text"
        "subDescriptions": "text",
        "subDescriptions": "text",
        "subDescriptions": "text",
    ]
}

上面没有有效的JSON( subdescriptions 是重复的键,一切都应该是唯一的(。如果您想要多个描述,则可以拥有

之类的东西
{
    "project": [
      {
        "descriptions": "text",
        "name": "text",
        "comment": "text",
        "subdescriptions": 
          [
            { "text1" },
            { "text2" },
            { "text3" }
          ]
      }
    ]
}

然后,您可以用上述手柄解析

{{#each subdescriptions}}
    <p>{{this}}</p>
{{/each}}

最新更新