如何从 Meteor 中的动态模板调用方法

Question

我正在 Meteor 中构建一个设置页面，其中将包含许多设置类别的动态模板。

我想做的是在我的类别模板中有一个方法，当我单击父模板上的提交按钮时将调用该方法。

settings.html

<div>
  {{> Template.dynamic template=settings}}
  <div class="submit">
    <button>Save Changes</button>
  </div>
</div>

settings.coffee

Template.settings.events
    'click .submit button': ->
        dynamiclyLoadedTemplate.save()

我的动态-template.coffee

Template.dynamicTemplate.onCreated ->
    @save = ->
        # doSomething()

我的其他动态-template.coffee

Template.otherDynamicTemplate.onCreated ->
    @save = ->
        # doSomethingElse()

这可能吗？

我应该将这些方法创建为 window 方法，而不是模板方法吗？

Answer 1

我有一个类似的模式，我只是将事件附加到父模板（加载动态模板的模板）。数据上下文将是父级的，但这仍然比将方法附加到 window 对象要好，尤其是因为在我的例子中，子模板都处理相同的类型无论如何对象。

对于您的情况，首先将动态模板的父级设为模板本身：

<template name="parent">
  <div>
    {{> Template.dynamic template=settings}}
    <div class="submit">
      <button>Save Changes</button>
    </div>
  </div>
</template>

然后只需将事件附加到该父项：

Template.parent.events
    'click .submit button': ->
        save() // generic save function you've defined, for example in this file

当动态包含的模板具有相同类型的对象并且通常具有相似的 DOM 元素（至少是您要附加事件的那些元素）时，这种方法很有效。

Answer 2

您可以在您的子模板中添加以下代码：

Template.childTemplate.onCreated ->

    settingsTemplate = this.parentTemplate(...) # ... = number of upstream levels
    settingsTemplate.child ?= []
    settingsTemplate.child.push this

    @save = ->
        console.log 'Save called'

因此您可以在父模板上调用以下代码：

Template.parentTemplate.events

    'click .submit button': ->
        console.log 'submit button clicked'

        instance = Template.instance()

        if instance.child?.length > 0
            for child in instance.child
                child.save?()

如何从 Meteor 中的动态模板调用方法

How to call a method from a dynamic template in Meteor

javascript

coffeescript

meteor

meteor-blaze