使用把手访问数组中所有对象的特定元素时出现问题

时间:2018-11-16 11:28:08

标签: node.js express express-handlebars

我对Handlebars比较陌生,因此可能缺少一些简单的东西,但是我似乎无法输出数组中每个对象的特定元素。我搜索了多个帖子并阅读了车把文档,但到目前为止还没有找到解决方案。基本上,我试图输出一系列时隙的可用性及其分配给一个项目的状态。这是我的代码...

数据

Pitch: {
"name": "test",
"price": 11,
"city": "testCity",
"availability": [
    {
        "status": "reserved",
        "dt": "2018-11-16T20:00:00Z"
    },
    {
        "status": "available",
        "dt": "2018-11-16T19:00:00Z"
    }
]
}

index.js

router.get('/availability/:id', function(req, res, next) {
Pitch.findById(req.params.id, function (err, docs){
    var indPitch = [];
    indPitch.push(docs);

    res.render('pitch/availability', { title: 'Availability', indPitch: indPitch });

});

availability.hbs

{{#each indPitch}}
        <h3><a href="/availability/{{ id }}">{{ name }}</a></h3>
        <p class = "description">{{ city }}</p>
        {{#each availability}}
          {{status}}
          {{dt}}
        {{/each}}
        <p class = "description">Price per hour : €{{ price }}</p>
        <a href="/reserve/{{id}}" class="btn btn-primary pull-right" role="button">Select</a>
{{/each}}

使用上面的把手代码,仅城市和价格输出到屏幕。如果我将{{#eachavailability}}更改为{{#eachthis}},然后以{{availability。[0] .status}}或{{availability。[1] .dt}}等访问对象。然后,我可以将该项目输出到屏幕上。

但是,我需要做的是遍历该项目的“可用性”并显示所有日期/时间及其状态。有什么想法我做错了吗?如果您需要更多信息,请告诉我。

2 个答案:

答案 0 :(得分:0)

只需在每个应该起作用的元素之前使用它

 {{#each indPitch}}
    <h3><a href="/availability/{{ id }}">{{this.name }}</a></h3>
    <p class = "description">{{ this.city }}</p>
    {{#each availability}}
      {{this.status}}
      {{this.dt}}
    {{/each}}
    <p class = "description">Price per hour : €{{ this.price }}</p>
    <a href="/reserve/{{this.id}}" class="btn btn-primary pull-right" role="button">Select</a>

{{/ each}}

答案 1 :(得分:0)

好吧,因此在尝试了#each this和#each可用性的每种组合几个小时之后,最终一个成功了。万一其他人遇到同样的问题,请在此处发布答案...

我不得不按如下方式将{{#each availabilty}}嵌套在{{#each this}}内...

{{#each indPitch}}
<h3><a href="/availability/{{ id }}">{{this.name }}</a></h3>
<p class = "description">{{ this.city }}</p>
{{#each this}}    
    {{#each availability}}
        {{status}}
        {{dt}}
    {{/each}}
{{/each}}
<p class = "description">Price per hour : €{{ this.price }}</p>
<a href="/reserve/{{this.id}}" class="btn btn-primary pull-right" role="button">Select</a>
{{/each}}