Question

我的meteor应用程序的一部分是一个半协作表，用户可以同时编辑不同的行。当用户编辑行时，静态文本值需要切换到输入框，以便可以编辑然后保存这些值。我想要一个模板/助手来完成这个，基本上我想要：

<td>
{{#if iAmEditing}}
   {{foo}}
{{else}}
   <input type="text" name="foo" value="{{foo}}">
</td>

除了有几个列具有不同的“foo”值，我不想复制和粘贴这几次。使用模板和助手来解决这个问题的正确方法是什么？

另一种方法可能是使用HTML5 contenteditable属性。无论哪种方式，用把手模拟这些值的正确方法是什么？

Answer 1

您应该能够与Bootstrap Editable

集成

Answer 2

供参考，回答原问题......

截至今天，车把部分不能接受除了上下文参数之外的任何内容，但帮助者可以。因此。您可以定义一个帮助器来设置模板的上下文：

CoffeeScript的：

Handlebars.registerHelper "eventCell", (context, field, editable) ->
  return new Handlebars.SafeString(
    Template._eventCell
      _id: context._id
      field: field
      value: context[field]
      editable: editable
  )

模板：

<template name="_eventCell">
    <td><div data-ref="{{field}}" class="{{#if editable}}editable{{/if}}">
        {{value}}
    </div></td>
</template>

然后，我只使用以下内容来渲染每个字段：

{{eventCell this "province" iAmEditing}}

我最终与bootstrap可编辑集成，因此模板与我原来的问题略有不同。此外，我不确定这是最好的方法，但它比我以前更清洁。

Answer 3

meteor-editable是一个实现x-editable之类的新项目，但很好地与Meteor反应性集成。不幸的是，还不支持内联编辑（你必须按照它现在设置的方式使用弹出框。）

Meteor Handlebars模板：从文本切换到输入

3 个答案: