时间戳

首页 > 解决方案 > 如何在 HTML 中有条件的换行

javascript - 如何在 HTML 中有条件的换行

问题描述

如何有条件地将换行符添加到 HTML 按钮/s？

我有这样的按钮：

+----------------+
| Button Clicked |
|      (5)       |
+----------------+

现在我有条件，如果我设置按钮的隐藏文本，它将仅隐藏文本“按钮单击”并将文本“（5）”设置为垂直和水平居中。它应该是这样的：

+---------------+
|               |
|      (5)      |
|               |
+---------------+

这是我的 HTML 代码：

<button style="text-align:center; overflow: hidden;" class="btn btn-primary">
     {{btnClicked == 'hide' ? '' : 'Button Clicked'}} <br /> ({{clckCount}})
</button>

我试过这个：

<button style="text-align:center; overflow: hidden;" class="btn btn-primary">
         {{btnClicked == 'hide' ? '' : 'Button Clicked <br />'}} ({{clckCount}})
</button>

但它打印/显示我的代码到按钮。

标签： javascripthtmlangularjs

解决方案

Javascript 不是模板框架，它是 javascript。双胡须语法中的代码是评论者所询问的。

它看起来不像 Handlebars 或 Blade，因为您没有在其中添加 #if 语句。它看起来确实像 Vue.js。

但是，在 Vue.js 中，您应该将条件放在v-if属性中。

<span v-if="'hide' == btnClicked">Button Clicked <br /></span> ({{clckCount}})

推荐阅读