JavaScript：在模板变量中添加 if 条件答案

【问题标题】：JavaScript: Adding if condition inside of a template variableJavaScript：在模板变量中添加 if 条件
【发布时间】：2019-09-06 03:41:23
【问题描述】：

我在 Javascript 中有一个模板变量，如下所示

 var TABLE_ROW = '<tr class={{bgColor}}>'
            + '<td><input id={{ID}} type="checkbox" class="mysqlListCheckbox" checked="checked"/> <span style="padding: 7px;">{{COUNT}}</span></td>'
    + '<td><p class=text-warning>{{COMMENTS}}</p></td>'
    + '</tr>';

此时始终选中 ID，但我想修改它，例如如果 COMMENTS 为空，则不应选中/选择 ID。

我是 Javascript 模板变量的新手。非常感谢任何实现此目的的参考链接。

谢谢。

【问题讨论】：

您使用的是哪种模板引擎？它不是内置的 Javascript 功能。我想那里的 JS 文本在提供给客户端之前会通过引擎进行转译？
这只是一个字符串，它被一些额外的自定义 JavaScript “解释”为“模板”。
您是在使用模板引擎还是只想在字符串中传递 javascript 变量？如果您只想将变量传递给 js 中的字符串，它的工作方式类似于 var TABLE_ROW = `some stuff here ${theVariable} and other stuff here.` - `` 非常重要。如果您使用的是模板引擎，则必须先用变量编译字符串。

标签： javascript html string if-statement ecmascript-6

【解决方案1】：

由于您是 Javascript 新手，请尝试了解 JS 的工作原理。 JS 本身不提供任何开箱即用的模板，如果您使用过 HandleBars，您可以使用 HandleBars.js。我建议您使用辅助函数来处理此问题。

车把链接 https://handlebarsjs.com/

Handlebars.registerHelper('decideSelect',function(param){
    if(param.COMMENTS.length==0){
        let Htmlstr =  '<td><input id='+param.ID+' type="checkbox" class="mysqlListCheckbox" /> <span style="padding: 7px;">'+param.COUNT+'</span></td>'+'<td><p class=text-warning>'+param.COMMENTS+'</p></td>';
        return Htmlstr;
    }else{
        let Htmlstr =  '<td><input id='+param.ID+' type="checkbox" class="mysqlListCheckbox" checked="checked"/> <span style="padding: 7px;">'+param.COUNT+'</span></td>'+'<td><p class=text-warning>'+param.COMMENTS+'</p></td>';
        return Htmlstr;
    }


});
};

var TABLE_ROW = '<tr class={{bgColor}}>'
    + '{{decideSelect this}}</tr>';

【讨论】：

【解决方案2】：

使用三元运算符（如果模板引擎支持）：

var TABLE_ROW = '<tr class={{bgColor}}>'
            + '<td><input id={{ID}} type="checkbox" class="mysqlListCheckbox" checked={{COMMENTS == "" ? "" : "checked"}}/> <span style="padding: 7px;">{{COUNT}}</span></td>'
    + '<td><p class=text-warning>{{COMMENTS}}</p></td>'
    + '</tr>';

【讨论】：