Question

我正在尝试访问与调用辅助函数的特定模板实例相对应的DOM元素。当我阅读Meteor文档时，Template.instance（）应该返回调用帮助程序的模板实例对象，类似Template.instance（）。$（）允许我在该实例中获取DOM元素。

但是，以下代码（以及类似的变体）对我不起作用：

* HTML *

<template name="input_container">
    <div class="small-12 medium-12 large-6 columns empty {{isActive}}"></div>
</template>

* JS *

Template.input_container.helpers({
   isActive: function() {
       if (Template.instance().$('.empty') && [some Session variable logic] {
           return 'active';
       }
   }
});

当我做类似的事情时：

if (some Session logic) {
    console.log(Template.instance())
}

我帮助正确记录了多个版本：

Blaze.TemplateInstance {view: Blaze.View, data: 7, firstNode: div.small-12.medium-12.large-6.columns.empty.active-container, lastNode: div.small-12.medium-12.large-6.columns.empty.active-container, $: function…}

（数据：值适当地从1-12开始，但每个都看起来相同）

如何从中获得能够使用模板方法，例如模板。$或template.find？

编辑：

虽然不是一个完美的解决方案，但我确实设法通过使用Template.currentData（）并在每个输入实例上设置标识符来解决其中一些问题。

Template.create_form.helpers(
  # Create 12 input containers
  inputContainer: () ->
    [0..11]

然后：

Template.input_container.helpers(

isActive: () ->
    # Get which template instance we are working with, will return the number 0-11 that was used to create it
    current = Template.currentData()

    # Now I can do $(".input-container").eq(current) to grab the correct DOM element

）

但是需要使用这么多jQuery似乎有点脏。

Answer 1

我不确定我是否正确解释了这个问题，但是如果你试图访问页面上的另一个DOM元素 - 我可以使用jquery选择器。

例如，给出

的html

<input type="textfield" id="initials" value=" ">

和

的简单流星模板

<template name="demo">
    <input type="button" div id="s0">
</template>

单击s0按钮时，我可以成功访问首字母字段，如下所示

Template.demo.events({
   'click .cell': function(event, template) {
        if ($('#initials').val().trim().length > 0) {
           console.log($('#initials').val().trim() + ' - you clicked button '+$(event.target).attr('id'));
    }
},

访问正在调用帮助程序的模板实例的DOM表示形式

1 个答案: