元素，如果表示返回空值，则为隐藏元素。

Question

我正在nodejs和express上创建应用程序。我从端点获取json数据，并根据所得到的值在页面上呈现它。

问题是，如果从json数据中获得空值或未定义值，我将如何隐藏整个元素。

这是我的密码：

        var obj = JSON.parse(body)

        res.render("index", {
          name : `${obj.data.name}`,
          uname : `${obj.data.username}`,

          bio : `${obj.data.bio}`,
          location : `${obj.data.location}`,
          link : `${obj.data.website}`

在hbs模板页面上呈现值：

<div class="ml-9 w-full mt-1 px-3 mb-5 inline-block">
        <div class="inline-block mr-5">
            <i class="fas fa-map-marker-alt text-lg opacity-75 inline"></i>
            <p  class="text-xl inline ml-2 bio">{{location}}</p>
        </div>
        <div class="inline-block mx-5">
            <i class="fas fa-link text-lg opacity-75 inline"></i>
            <p  class="text-xl inline ml-2 link text-blue-400">{{link}}</p>
        </div>
        <div class="inline-block mx-5">
            <i class="fas fa-calendar-alt text-lg opacity-75 inline"></i>
            <p  class="text-xl inline ml-2 bio">{{join}}</p>
        </div>
</div>

现在，如果我得到空或未定义的位置或bio，我将如何隐藏整个div。

​

​

Answer 1

您可以在hbs模板中使用IF条件。

{{#if location}}
<p  class="text-xl inline ml-2 bio">{{location}}</p>
{{/if}}

只有当它出现时，它才会打印该值。

Answer 2

您可以使用内置助手如果。

Answer 3

使用{{#if}}。我想这会解决你的问题