如何在Meteor JS中基于Button Click将模板数据附加到另一个模板?

时间:2015-03-04 04:06:35

标签: meteor

一个模板有按钮而另一个模板包含一个文本字段。当按钮点击该文本字段同时附加到按钮模板时不删除以前的文本字段,这意味着该按钮被单击4次4个文本字段添加到按钮模板。

请参阅以下代码:

HTML代码:

<head>
  <title>hello</title>
</head>

<body>
  <h1>Welcome to Meteor!</h1>

  {{> hello}}

</body>

<template name="hello">


    Add Text Fields here :

    <button>add another text box</button>

</template>

<template name="home">

    <input type="text" id="name" />

</template>

JS代码:

if (Meteor.isClient) {


  Template.hello.events({
    'click button': function () {

     //Here to write append logic
    }
  });
}

我对此没有任何想法。所以请建议我为此做些什么?

1 个答案:

答案 0 :(得分:2)

仅使用客户端集合。单击添加新记录。然后在主页模板中循环播放。 new Meteor.Collection(null) null将告诉它它只是本地的,并且实际上不会在MongoDB中创建集合。

if (Meteor.isClient) {
    var buttonClicks = new Meteor.Collection(null),
            clickCounter = 0;

    Template.hello.events({
        'click button': function () {

            buttonClicks.insert({click: clickCounter++});
        }
    });

    Template.home.helpers({
        clicks: function () {
            return buttonClicks.find({});
        }
    });
}

<template name="home">
{{#each clicks}}
    <input type="text" id="name_{{click}}" />
{{/each}}
</template>