Question

我有一个对象，我想限制前端显示的项目数。问题是我使用hogan js模板来渲染我的HTML。我不明白如何在hogan js中实现逻辑。

路由代码我在哪里设置对象：

res.render('search', {
          layout : 'layouts/main/default',
          partials:{
                   Header: "includes/main/header",
                   Slider: "includes/main/slider",
                   Contact: "includes/main/contact",
                   Footer: "includes/main/footer",
                   Search : "includes/main/search"
          },
          title   :  'Result',
          product :  data.product, //here I set the product Json data 
          total   :  totalProducts,
 })

产品 JSON 包含以下数据：

{ product: 
   [ { link: 'http://www.walmart.com/ip/Straight-Talk-Samsung-Prepaid-Galaxy-GRAND-Prime-LTE-S920C-Smartphone/46716301',
       image: 'http://i5.walmartimages.com/dfw/dce07b8c-39c4/k2-_b4b0e2b5-8534-4979-8953-aae10886c54c.v1.jpg',
       name: 'Straight Talk <mark>Samsung</mark> Galaxy GRAND Prime 4G LTE Android Prepaid Smartphone',
       price: '149',
       logo: '/images/wal.png',
       siteName: 'Walmart'
      },
      { link: 'http://www.walmart.com/ip/T-Mobile-Samsung-Galaxy-S4-Prepaid-Smartphone/43388843',
       image: 'http://i5.walmartimages.com/dfw/dce07b8c-d26b/k2-_8f1131b8-61d3-4760-8129-9a740eb10e9b.v1.jpg',
       name: 'T-Mobile <mark>Samsung</mark> Galaxy S4 Prepaid Smartphone',
       price: '149',
       logo: '/images/wal.png',
       siteName: 'Walmart' 
      },
      ......
      ......
     ]
}

Search.hjs 包含html代码：

<div class="row">
     {{#product}}
     <div class="col-md-4 col-sm-6">
        <div class="center">
           <img src="{{image}}"  class="img-rounded" height="100" width="100"/>
           <h4>{{name}}</h4>
           <h4>{{price}}</h4>
           <a href="{{link}}"> <button type="button" class="btn btn-info">View Details</button></a>
        </div>
     </div>
     {{/product}}
</div>

我想一次只显示三种产品。

Answer 1

我不明白如何在hogan js中实现逻辑。

Hogan（以及它所基于的Mustache）被称为 logic- less 模板引擎。它没有为您提供从模板中执行这些类型任务的逻辑。

我想限制前端显示的项目数

您必须限制服务器端的数组大小：

product : data.product.slice(0, 3)

如何使用hoganjs模板显示for循环中的项目数

1 个答案: