Question

我正在使用把手在服务器端渲染代码（没有角度/余烬）

我还能以某种方式得到类似的东西：
<p dir="auto" {{#if isRTL: class=align-right}}>{{{content}}}</p>

我希望只有在bolean为真时才有CSS类类似于ember的bind-attr ......

没有它，代码就是一团糟：

{{#if isRTL}}
    <p dir="auto" class="align-right>{{{content}}}</p>
{{else}}
    <p dir="auto">{{{content}}}</p>
{{#if}}

Answer 1

没有必要包装整个HTML元素。您可以使用class子句包装if。

<p dir="auto" {{#if isRTL}}class="align-right"{{/if}}>{{{content}}}</p>

仅当class="align-right"真实时，才会呈现isRTL属性。

此外，由于 Handlebars 是 Mustache 的扩展，您可以使用：

<p dir="auto" {{#isRTL}}class="align-right"{{/isRTL}}>{{{content}}}</p>

Answer 2

我已经注册了一个帮助程序，以保持清洁，以防有更多的类要添加。

required init(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    xibSetup()
    contentTextField.delegate = textFieldDelegate
}

模板：

nil

变量：

/**
 * Prints an objects key if the value is true.
 * example: {printed:true, pleaseprint:'hello', notprinted:false, noprint:undefined}
 */
handlebars.registerHelper("printif", function(object){
    // stringToPrint:boolean
    var out = [];
    for (var string in object) {
        var value = object[string];
        if (false===value || null===value || undefined===value) {
            continue;
        }
        out.push(string);
    }
    return out.join(' ');
});

因此，如果isRTL为true，则输出字符串：

<div class="module {{printif moduleVars}}">

Answer 3

有了一个助手，我变得干净了。但就我而言，条件是两个变量的真实性。

//js
Handlebars.registerHelper('ternary', function(cond, v1, v2) {
   return cond ? v1 : v2;
});

//html
<p dir="auto" class="some-other-class {{ternary isRTL 'align-right' 'align-left'}}">{{{content}}}</p>

使用纯手柄的html条件类

3 个答案: