6

我在模板导航中有一个名为 {{renderNav}} 的模板助手

例如

Template.Nav.renderNav

在那个辅助函数中,我想解析另一个模板中另一个辅助函数的渲染输出

例如助手

Template.contentWindow.content

它提供了 html

{{content}}

我的 renderNav 助手想要分割替换 {{content}} 的 html 以生成 html

{{renderNav}}

我该怎么做?现在 {{renderNav}} 帮助程序执行或运行得更快,因此它无法解析替换 {{content}} 的 html

@Hugo-按照您的建议,我在代码中执行了以下操作

Template.contentWindow.rendered = function() {
    debugger;  
    return Session.set('entryRendered', true);
};

Template.Nav.renderNav = function() {
    debugger;
    var forceDependency;
    return forceDependency = Session.get('entryRendered');
};

当我运行它时,调试器在执行 renderNav 助手时首先停止。(这与我在比赛条件方面看到的情况是有道理的)。然后 contentWindow 呈现,我在 Session.set('entryRendered', true) 上方打断点。但是随后 renderNav 不会按照您的建议再次运行。我是否误解或错误地执行了您的建议?

4

2 回答 2

4

您需要在要重新运行的模板中存在依赖项。可能性很小,具体取决于您想要获得的数据。

例如,您可以在content模板中设置一个反应标记,通知renderNav它已完成绘图。

Template.contentWidnow.rendered = function() {
    ...

    // Set this on the very end of rendered callback.
    Session.set('contentWindowRenderMark', '' +
        new Date().getTime() +
        Math.floor(Math.random() * 1000000) );
}


Template.renderNav.contentData = function() {
    // You don't have to actually use the mark value,
    // but you need to obtain it so that the dependency
    // is registered for this helper.
    var mark = Session.get('contentWindowRenderMark');

    // Get the data you need and prepare for displaying
    ...
}

 


 

使用您提供的更多信息,我们可以创建这样的代码:

内容.js

Content = {};
Content._dep = new Deps.Dependency;

内容窗口.js

Template.contentWidnow.rendered = function() {
    Content.headers = this.findAll(':header');
    Content._dep.changed();
}

渲染导航.js

Template.renderNav.contentData = function() {
    Content._dep.depend();
    // use Content.headers here
    ...
}
于 2013-07-11T08:10:57.417 回答
3

如果您希望在 contentWindow 呈现时自动重建导航,正如 Hubert OG 建议的那样,您还可以使用更简洁、更低级别的方式来使上下文无效:

var navDep = new Deps.Dependency;

Template.contentWindow.rendered = function() {
    ...
    navDep.changed();
}

Template.renderNav.contentData = function() {
    navDep.depend();

    // Get the data you need and prepare for displaying
    ...
}

有关详细信息,请参阅http://docs.meteor.com/#deps

另一方面,如果您想手动渲染另一个模板,您可以将其作为函数调用:

var html = Template.contentWindow();

返回的 html 不会是响应式的。如果您需要反应性,请使用:

var reactiveFragment = Meteor.render(Template.contentWindow);

有关其工作原理的详细信息,请参阅http://www.eventedmind.com/上有关 Spark 和反应性的截屏视频。

更新

将渲染片段添加到 DOM:

document.body.appendChild(Meteor.render(function () {
    return '<h1>hello</h1><b>hello world</b>';
}));

您还可以使用 DOM API 直接访问呈现的节点:

console.log(reactiveFragment.childNodes[0]);
于 2013-07-11T09:36:20.357 回答