Question

当我在帮助器中更改模板数据时，模板不会更改：

{{#each items}}
  {{> item disabled=""}}
{{/each}}

<template name="item">
  <button id='disable'>Disable other button</button>
  <button disabled="{{disabled}}">Sometimes disabled</button>
</template>

Template.item.events
  'click #disable': ->
    this.disabled = 'disabled'

我也尝试过：

Template.item.events
  'click #disable': (e, tmpl) ->
    tmpl.disabled = 'disabled'

Template.item.helpers
  disabled: ->
    Template.instance().disabled

我可以使用一堆全局会话变量使其工作，但我希望有更好的模式吗？

Template.item.events
  'click #disable': ->
    Session.set 'item-' + this._id, 'disabled'

Template.item.helpers
  disabled: ->
    Session.get 'item-' + this._id

Answer 1

问题是设置非反应变量不会导致模板助手重新运行。您可以通过将ReactiveVar附加到模板实例来解决此问题，如下所示：

Template.item.created = ->
  @isDisabled = new ReactiveVar false

Template.item.events
  'click #disable': (e, template) ->
    template.isDisabled.set (not template.isDisabled.get())

Template.item.helpers
  isDisabled: ->
    Template.instance().isDisabled.get()

然后你的模板看起来像：

{{#each items}}
  {{> item}}
{{/each}}

<template name="item">
  <button id='disable'>Disable other button</button>
  <button disabled={{isDisabled}}>Sometimes disabled</button>
</template>

请注意，您需要meteor add reactive-var才能实现此目的。

我在this post中详细介绍了这个主题。

如何使模板数据动态/反应？

1 个答案: