设置Meteor JS Helper的返回值，将其动态注入到模板中 [英] Set the return value of Meteor JS Helper, inject this dynamically into template
问题描述
给出下面的答案，使用似乎是理想的游戏，因为我想在两个不同的模板之间共享数据，并且它应该对发生的任何变化产生响应。 澄清：我的数据来源是 END编辑 我正在设置<$ c （特别是， buttons.html： 通过这种硬编码，它可以按预期工作（两个按钮呈现为Alice和Bob标签 模板愉快地接受并呈现这个对象数组。但是，当我动态地生成对象数组时。 目标：对于包含在我的h1标签中的每个唯一字词，生成一个按钮（几乎就像博客标签）。 html是： 然后在下方运行代码段n控制台，将根据需要创建 然后我如何将 假设这个html： 您可以使用这个实现： 注意您需要做： 创建 由于 EDIT: Given the answers below, using Meteor Deps seems like the ideal play since I want to share data between two distinct templates, and it should be reactive to any changes that occur. To clarify: source of my data is END EDIT I am looking to set the value of buttons.html: With this hard-coded it works as expected (two buttons render labeled Alice and Bob The template happily accepts and renders this array of objects. However, NOT when I generate the array of objects dynamically. Goal: for each unique word contained within my h1 tags, generate a button (almost like a blog tags). By replacing my helper code with snippet below (using jquery parsing Assume html is: then run snippet below in console, will create How do I then send Assuming this html: You can get it to work with this implementation: Note you will need to do: When the Because the 这篇关于设置Meteor JS Helper的返回值，将其动态注入到模板中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
Template.reactiveTable ，目的地是模板.buttons 。当 reactiveTable 中的数据发生变化时，我希望按钮反映这一点。
< h1> 值）。code>按钮
< template name =buttons>
{{#each testButtons}}
< button id ={{name}}> {{name}}< / button>
{{/每个}}
< / template>
$ p $ UI.registerHelper（'testButtons'，function（）{
return [
{name：Alice}，
{name：Bob}
]
}
）
< h1> 标签，生成要发送给模板的数组）。
< h1> foo< / h1>
< h1> bar< / h1>
< h1> baz< / h1>
uniqStrings = [foo，bar，baz]; 。
$（'h1'）.map（function（）{
var words = [];
words.push（$（this）.text（））;
uniqStrings = _.uniq（words）;
}）;
uniqStrings 发送回我的按钮模板呈现 n = uniqStrings.length 按钮？谢谢！
<身体GT;
< h1> Alice< / h1>
< h1> Bob< / h1>
{{>按钮}}
< / body>
< template name =buttons>
{{#each testButtons}}
< button id ={{name}}> {{name}}< / button>
{{/每个}}
< / template>
Template.buttons.helpers（{
testButtons：function（）{
var words = UI._templateInstance（）。state.get（'words' ）;
return _.map（words，function（word）{
return {name：word};
}）;
}
}）;
Template.buttons.rendered = function（）{
var words = $（'h1'）。map（function（）{
return $（this）.text（ ）;
}）;
this.state.set（'words'，_.uniq（words））;
};
Template.buttons.created = function（）{
this.state = new ReactiveDict;
};
meteor add reactive-dict
按钮模板时会初始化其内部反应状态。渲染完成后，将使用页面上所有 h1 标签中的文本填充该状态。由于该状态是被动的，因此它会导致 testButtons 运行并将格式正确的数据返回到您的模板。请在作用域反应性上查看我的帖子以获取更多详情。
按钮模板使用范围反应性，因此可以在任何页面上随意使用多次，而无需修改父模板。Template.reactiveTable and the destination is Template.buttons. When the data in reactiveTable changes, I want the buttons to reflect this. buttons based on the content of a table (specifically, the <h1> values). <template name="buttons">
{{#each testButtons }}
<button id="{{ name }}">{{ name }}</button>
{{/each}}
</template>
UI.registerHelper('testButtons', function () {
return [
{ name: "Alice" },
{ name: "Bob" }
]
}
)
<h1> tags, generate array to send to template). <h1>foo</h1>
<h1>bar</h1>
<h1>baz</h1>
uniqStrings = [ "foo", "bar", "baz"]; as desired.$( 'h1' ).map(function () {
var words = [];
words.push($(this).text());
uniqStrings = _.uniq(words);
});
uniqStrings back to my buttons template to render n= uniqStrings.length buttons? Thanks!<body>
<h1>Alice</h1>
<h1>Bob</h1>
{{> buttons}}
</body>
<template name="buttons">
{{#each testButtons }}
<button id="{{ name }}">{{ name }}</button>
{{/each}}
</template>
Template.buttons.helpers({
testButtons: function() {
var words = UI._templateInstance().state.get('words');
return _.map(words, function(word) {
return {name: word};
});
}
});
Template.buttons.rendered = function() {
var words = $('h1').map(function() {
return $(this).text();
});
this.state.set('words', _.uniq(words));
};
Template.buttons.created = function() {
this.state = new ReactiveDict;
};
meteor add reactive-dictbuttons template is created is initializes its own internal reactive state. After it is rendered, it fills that state with the text from all of the h1 tags on the page. Because that state is reactive, it will then cause the testButtons to run and return the correctly formatted data to your template. Please see my post on Scoped Reactivity for more details.buttons template uses scoped reactivity, it can be used as many times as you like on any page without modification to the parent template.
