标签: jsrender

我正在尝试jsRender.

我想做的事:

JS模板:

<script id="theaterTemplate" type="text/x-jquery-tmpl">
    {{* 
        if ("{{=theaterId}}" == getCurrentTheaterId()) {
    }}
        <a class="active" href="#">
    {{*
        } else {
    }}         
        <a href="#">           
    {{* } }}
        {{=theaterName}}
    </a>
</script>

在其他JS中:

function getCurrentTheaterId() {
    return "523";
}

基本上,在模板中,如果迭代中的当前影院id与从js函数返回的内容匹配,则将该类设置为active."{{= theaterId}}"在if条件中中断.我猜你不允许在if条件下访问当前的json属性.

关于如何做到这一点的任何想法？

希望这是有道理的.谢谢!

我正在使用jsRender在html页面上呈现我的数据.数据完美呈现.但是,在某些内容项中,HTML文本(如超链接)显示为文本.在jquery模板中,有一种方法可以通过{{html来呈现HTML.jsRender中有类似的东西吗？我的代码如下:

<p>
{{ =Status}}   //need to convert this to HTML so it should appear as hyperlink.
</p> 

谢谢.

在我的工作场景中，我在js渲染模板中使用以下代码段：

{{:#data['" + columnName + "']}} 

这将返回值为：

[object Object],[object Object]

如何[object Object],[object Object]使用for循环从js渲染模板中的此数组对象获取特定属性？

在中<script type="text/x-jsrender">，所有代码均以白色显示。如果我只是更改x-jsrender为html，则语法突出显示将按预期工作。

有没有办法教VS代码对待x-jsrender像html？

如何在JSRender中的模板中渲染模板？在之前的jquery模板中,我可以使用

{{tmpl(Languages) "#languageTemplate"}}

在JSRender中,我可以在条件语句和循环中找到模板组合示例.我想独立调用模板.

我想在我的网页的不同部分使用嵌套模板.对于不同的部分,我需要从嵌套模板中的数组中获取值.我不能使用for循环,因为每个部分在网站上有不同的类和位置.是否可以将变量传递给嵌套模板？以下代码简化了我要实现的目标:

<script id="myBtnTmpl" type="text/x-jsrender">
    <button class="btn">        
        {{:myData.myArray[INDEX_VARIABLE].btnName}}
    </button>
</script>

//  Here I want to use INDEX_VARIABLE = 0
<div class="BigButton">
    {{if myData tmpl="myBtnTmpl"/}}
</div>

//  Here I want to use INDEX_VARIABLE = 1
<div class="MediumButton">
    {{if myData tmpl="myBtnTmpl"/}}
</div>

//  Here I want to use INDEX_VARIABLE = 2
<div class="SmallButton">
    {{if myData tmpl="myBtnTmpl"/}}
</div>

另一个问题:当使用嵌套模板时,可以包含嵌套模板,如{{tmpl ="myBtnTmpl"/}},而不使用if语法？

谢谢!

我试图用jsrender模板中的值更新全局javascript变量.我怎样才能完成它......

我创造了一个小提琴http://jsfiddle.net/4RH7n/8/

我需要将最后一个电影名称放入该javascript变量中..

如何仅从我的json数据循环选定的组/对象列表？例如,我只想在下面的例子中循环"ID2",

JSON,

 { 
"ID1": {
        "items":{
            "0": "VALUE1",
            "1": "VALUE2",
            "2": "VALUE3",
            "4": "VALUE4"
        }
    },
"ID2": { 
        "items": {
            "0": "VAL2-1",
            "1": "VAL2-2",
            "2": "VAL2-3"
        }
    }
}

JS,

myTmpl2 = $.templates("#myTmpl2");
    $("#result2").html(
        myTmpl2.render(data2)
    );

模板,

<script id="myTmpl2" type="text/x-jsrender">
{{props #data}}
    <tr>
            <td>{{:key}}</td>

                {{for prop}}
                    {{props items}}

                     <td>{{>key}} - {{>prop}}</td>

                    {{/props}}
                {{/for}}


            </tr>
{{/props}}
</script>

结果,

ID1     0 - VALUE1  1 - VALUE2  2 - VALUE3  4 - VALUE4
ID2     0 - VAL2-1  1 - …

我有一个简单的模型：

var model =  [{
    content: "",
    type: "photo",
    src: "xxx"
}, {
    content: "",
    type: "quote",
    text: "blah"
}];

和一个简单的模板：

{{if type eq='photo'}}
    <img src="{{:src}}" />
    <div class="photo-caption">
        {{:caption}}
    </div>
{{else type eq='quote'}}
    <div class="quote-text">
        {{:text}}
    </div>
{{/if}}

问题是模板在type“引用”时根本不呈现任何内容。如果我将它稍微更改为两个ifs 而不是 an if-else，它会呈现引用，但也会呈现div class="photo-caption">. 我只需要它来渲染一个或另一个。我有一种感觉，这是一个简单的语法问题，但似乎无法在 JsRender 站点上找到有关如何正确完成此操作的足够文档。

这是一个小提琴。这两个模板的行为应该完全相同。相反，一个渲染两者，另一个只渲染图像。

http://jsfiddle.net/tQnVt/621/

这个小提琴说明了我的问题.

假设我在jsrender模板的帮助下将JSON绑定到视图上.

var vm = {
    foo: {color: "red",otherObjectToMatch:"object"},
    testData: [{color: "red"}, {color: "yellow"}, {color: "blue"}]
};

对象vm有2个属性 - 1)普通对象2)对象数组.

模板-

<script id="template" type="text/x-jsrender">
    <p>
    {{:foo.color}}
    </p>
    <ul>
    {{for testData}}
        <li>index: {{>color}}</li>
    {{/for}}
    </ul>
</script>

我想从普通对象#1的属性匹配,如果它的属性颜色与循环中的属性匹配,那么将应用一些类.

我试过了-

 <p>
    {{:foo.color}}
    </p>
    <ul>
    {{for testData}}
       {{if foo.color=={{>color}} }}
         <li class='match'>index: {{>color}}</li>
       {{else}}
         <li>index: {{>color}}</li>
       {{/if}}
    {{/for}}
    </ul>

这是一次失败的尝试.我找不到如何匹配jsrender中的其他对象.