如何在 Jsrender 模板中使用 javascript 变量答案

【问题标题】：How can I use javascript variable in Jsrender template如何在 Jsrender 模板中使用 javascript 变量
【发布时间】：2017-07-13 10:16:07
【问题描述】：

我是 JsRender 的新手，请帮助我解决以下问题...

我被一个愚蠢的问题困住了，我花了很多时间但找不到相关的文章寻求帮助。

在我的内心我创建了一个 javascript 变量 (s_name) 并希望在我的 for 循环中使用它作为我的单选按钮的名称。但我无法这样做。请在下面找到代码.. 需要你们的帮助..

{{for Product}}

            <div class="leftOptInner1 my_left_{{:Id}}" id="my_left_inneropt">

                <div class="leftIconInner1 my_{{:Id}}" name="{{:Name}}" id="{{:Id}}" >
                    <!-- <div class="leftIcon1 designer_left_icon "> -->
                    <div class="designer_left_icon ">

                        <img src="{{:ImageSource}}" width="100%" height="100%">
                    </div>
                    <p >{{:Name}}</p>
                    <span class="name" id="{{:Id}}"></span>
                    {{:"<scr" + "ipt type=&quot;text/javascript&quot;>"}}
                        var s_name = "{{:Name}}";
                        alert(s_name); 
                       // s_name.render();

                    {{:"</scr" + "ipt>"}}

                </div>

                    <div class="rightIconOptOuter" style="width: 100% !important; float: left;">
                  {{for Options}}

                    {{for Features}}

                    <div class="rightIconOptInnerBox">

                        <div class="tick">
                              <div class="single_set_designer col-md-2">

                      <div class="fav-heart1 fav-heart_deisgner" id="{{:Id}}">
                      <span class="name" id="{{:Id}}"></span>
                          <div class="checkbox" id="{{:Id}}">
                                      <label>
                                        <input class="myChk designer_chk" type="checkbox" id="{{:Id}}"  data-textronic_id="{{:Id}}" data-textronic_name="{{:Name}}" name="check[]" />
                                      </label>
                                    </div>
                        </div>


                      <div class="element_wrp text-center">
                        <img src="{{:ImageSource}}">
                        <p>{{:Name}}</p>
                        <div class="price_hide">
                        <a class="show_price" id="{{:Id}}"><i class="fa fa-inr" aria-hidden="true"></i> Add Cost</a>
                          <input class="cost_associated form-control text-center showdesign{{:Id}}" type="text" value="" name="cost" style="display: none;">
                      </div>


                       <input type="radio" name="WE_WANT_s_name_HERE" id="{{:Id}}" value="{{:Name}}">
                      </div>
                    </div>
                        </div>
                    </div>




                {{/for}}


                  {{/for}} 
                       {{/for}} //products

【问题讨论】：

标签： javascript jsrender jsviews

【解决方案1】：

帮助者

您可以将 s_name 变量作为助手传递。

见http://www.jsviews.com/#helpers

例如：

var helpers = {
    s_name_Hlpr: s_name,
  ...};

myTmpl.render(data, helpers);

然后写：

<input type="radio" name="{{:s_name_Hlpr}}" ... />

允许代码

或者（但最好避免）您可以在模板中允许代码访问：

见http://www.jsviews.com/#allowcodetag

第一组：

$.views.settings.allowCode(true);

然后写：

<input type="radio" name="{{*:s_name}}" ... />

上下文参数

也就是说，您似乎正试图从数据中初始化您的 s_name。

var s_name = "{{:Name}}";

您可能真的想从产品中传递名称，您可以这样做：

{{for Product}}
  ...
  {{for Options ~prod_name=Name}}
    ...
    {{for Features}}
      ...
      <input type="radio" name="{{:~prod_name}}" .../>
      ...
    {{/for}} 
    ...
  {{/for}} 
  ...
{{/for}} //products

（见http://www.jsviews.com/#contextualparams）

【讨论】：