从外部上下文获取属性数据答案

【问题标题】：Get property data from outer context从外部上下文获取属性数据
【发布时间】：2012-05-03 13:24:48
【问题描述】：

我正在尝试从嵌套模板访问父数据。

根据这个https://github.com/BorisMoore/jsrender/issues/34，我正在尝试做类似的事情，但我得到错误：data.parent is undefined。

在我的“主”模板中，我有声明

{{for Rooms  tmpl="#RoomTmpl" layout=true /}}

在#RoomTmpl

 <script id="RoomTmpl" type="text/x-jsrender">
     {{:parent.data.Room1Label}}
     {{for #data}}
         {{:RoomName}}
     {{/for}}
 </script>

我尝试了各种组合，但总是出错

 {{:parent.parent.data.Room1Label}}
 {{:#data.parent.parent.data.Room1Label}}
 {{:#data.parent.data.Room1Label}}
 {{:#data.parent.Room1Label}}

有人知道怎么做吗？

-- 解决方案 --

正确的语法是

#parent.parent.data.Room1Label

【问题讨论】：

标签： jquery-templates jsrender

【解决方案1】：

您希望逐步浏览视图并从父视图获取数据。视图是渲染模板的结果，因此嵌套块标签，例如 {{for...}}...{{/for}} 或 {{if...}}...{{/ if}} 将添加子视图。如果您将数组传递给“for”标签 {{for myArray}}，它将遍历数据数组并导致一个其数据属性为数组的子视图，然后该视图将具有子视图的集合对于每个渲染的项目。

所以你需要知道#view是视图，#view.parent是父视图，#view.parent.data是父视图的数据等等。#foo是#view.foo的缩写，所以#data是数据，#parent 是父视图等。

现在唯一的问题是正确计算父母的数量。您可以通过向数据添加方法来调试正在发生的事情：{ ... properties ..., test: function() {debugger;} }。现在在该数据项的模板中的任意位置添加 {{:test()}}，然后进入已编译的模板：查看视图、其父级等。

另一个技巧。如果您在任何块标记上设置模板变量，则可以从任何嵌套模板访问它。所以在你的例子中，你可以把

{{for Rooms tmpl="#RoomTmpl" ~label=Room1Label layout=true /}}

然后从嵌套模板访问它：

{{:~标签}}

这样您就不再需要担心通过父视图进行升级。

【讨论】：