如何定义一个变量并在 jsviews 模板上使用它？

【问题标题】：How to define a variable an use it on the jsviews templates?如何定义一个变量并在 jsviews 模板上使用它？
【发布时间】：2019-06-12 12:52:45
【问题描述】：

我想为 html 元素定义一个唯一的 id，我必须将其作为辅助函数的参数传递。

唯一 ID 是使用另一个辅助函数 (genearteUniqueId) 正确生成的，但我无法将其存储在变量中以重用它并将其传递给另一个函数。有人在使用 Jsviews 时遇到过这个挑战吗？

我尝试将 generateUniqueId() 结果分配给 {{:uniqueId=~generateUniqueId()}} 中的定义变量，然后将 uniqueId 变量作为参数传递 {{:~decorator(uniqueId}} 但它没有没用。

<div class="graph-row">
   <span class="bar-graph" id="{{:~generateUniqueId()}}" {{:~decorator(outOfPockets[0].paid, outOfPockets[0].total, ~generateUniqueId())}}></span>
</div>

【问题讨论】：

标签： javascript jsviews

【解决方案1】：

你可以定义自己的 getUniqueId() 来获取最后生成的 id，就像

var cnt = 0, lastId;

var myTmpl = $.templates("#myTmpl"),
  data = {},
  helpers = {
    generateUniqueId: function() {return (lastId = cnt++);},
    getUniqueId: function() {return lastId;},
    decorator: function(id) {return "title=YES" + id;}
  };

myTmpl.link("#page", data, helpers);

然后写

<span id="{{:~generateUniqueId()}}" {{:~decorator(~getUniqueId())}}></span>

或者，（虽然如果您使用 JsViews 数据链接，而不仅仅是 JsRender 渲染，最好避免这种情况），您可以使用以下方法将 allowCode 设置为 true：

$.views.settings.allowCode(true);
var cnt = 0;
function genId() {return cnt++;}
function dec(id) {return "title=YES" + id }

然后写：

<span id="{{*:(theid=genId())}}" {{*:dec(theid)}}>c</span>

【讨论】：