handlerbars.js检查列表是否为空

122

在Handlebars.js中，有没有一种方法可以在遍历列表/集合之前检查集合或列表是否为空或为空？

// if list is empty do some rendering ... otherwise do the normal
{{#list items}}

{{/list}}



{{#each items}}

{{/each}}

handlebars.js

— 德雷奇
source

209

“每个”标签也可以包含“其他”部分。因此，最简单的形式是：

{{#each items}}
// render item
{{else}}
// render empty
{{/each}}

— 埃姆雷·埃芬迪
source

很好，但是不能回答问题。如果要包装标签#each，例如<ul>标签（内含<li>s），则不希望空状态由包装<ul>。

— 莱昂纳多·雷尔

236

如果您要显示一次并且仅在数组包含数据时显示，请使用

{{#if items.length}}
    //Render
{{/if}}

.length 对于空数组将返回0，因此我们已经获得了真实的falsey值。

— 杜安
source

1

这两个答案都是正确的并且有效，并且它们都回答了问题。当数组中没有数据时，该如何显示某些内容。并非相反。

— Drejc 2014年

15

不，我同意，这是正确的答案。它不包含for循环。

— radtek

4

一个简单的例子：我想<ul>一次渲染一个标签，然后<li>为列表中的每个项目渲染一个标签。如果列表为空，我什至都不希望<ul>呈现，而<p>empty list<p>在内呈现其他内容<ul>则毫无意义。

— Fuad Saud

2

这个答案是特定于实现的。该文档车把指定[]被评估为假。@Drejc的答案是根据车把规格的正确答案。

— 斯蒂芬

1

谢谢老兄，这是比registerHelper更好的解决方案。

— 丹麦

38

好的，它比我想象的要简单：

{{#if items}}
// render items

{{#each items}}
// render item
{{/each}}

{{else}}
// render empty
{{/if}}

— 德雷奇
source

5

如果items为空数组（即的值为[]），则会产生真实值。而items.length为空数组生成一个falsey值。参见@Duane的答案。

— gfullam 2015年

呵呵……已经过去了3年了……可能是实现发生了变化，或者我简单地没有[]数组的情况。据我回忆，它为我工作。

— Drejc 2015年

12

你是对的。基于原生的JS”的行为我抢先评论if，但把手文档是很清楚的：‘如果它的参数返回false，undefined，null，""，0，或者[]，把手也不会渲染块。’ 我应该先检查一下文档。

— gfullam 2015年

8

如果要检查集合（光标）是否为空，则前面的答案将无用，而是必须使用count()方法：

{{#if items.count}}
    <p>There is {{items.count}} item(s).</p>
{{else}}
    <p>There is nothing</p>
{{/if}}

— 卡尔·S
source

2

@BasicWolf它不起作用，count可以与游标一起使用，如果您使用数组来代替length的话。

— Karl.S 2015年

这在检查数组和对象之间以及以不同方式处理它们时非常有用。

— 瑞安·沃尔顿

2

对于需要在{{#if}}之上使用{{#each}}的任何人（即for循环中的if循环）。是他们有三个不同的数组列表。

在if语句中使用查找可以为我解决问题。作为，上述答案并不能解决我的问题。

这是我的代码，

{{#each OtherRandomItems}}

  {{this}}

  {{lookup ../AnotherRandomItems @index}}

  {{#if (lookup ../RandomItems @index)}}
  // render items
  {{else}}
  // render empty
  {{/if}}

{{/each}}

— 阿卡什·塞格姆
source