下面有一个具有数字输入形式的基本模板。当您在表单中键入数字并单击“添加”时,将创建一个Divs列表。 Divs是使用“ synth”类和“ synth” +一个数字的ID创建的。这些数字基于计数器连续进行。
我不仅希望将此信息存储在数据库中,而且还希望以某种方式(最终)在用户登录时将其从以前的登录状态以“保存状态”访问Div列表。
我什至不确定我是否会以适当的方式进行处理。我只是将createSynth()函数粘贴在列表的“插入”中。我有一种“正确”地执行此操作的感觉,我应该有两个并行运行的事件-一个发送到列表Collection,另一个发送到dom / Template。然后,这两个块将交换数据(以某种方式),从而共同产生“保存状态”的错觉。
下面是我到目前为止的代码。
的HTML
<head>
<title></title>
</head>
<body>
{{> start}}
</body>
<template name="start">
<input id ="amount" type ="number" />
<input id ="submit" type="button" value="Add" />
<div id="applicationArea"></div>
</template>
Java脚本
var lists = new Meteor.Collection("Lists");
var counter = 0;
counterSynth = 0;
if (Meteor.isClient) {
'use strict';
Template.start.events({
'mousedown #submit' : function () {
var amount = document.getElementById("amount").value;
for(i=0;i<amount;i++) {
lists.insert({SoundCircle:createSynth()}); // I am inserting the entire function call, is this the right path?
}
function createSynth() {
var synth = document.createElement("div");
synth.className = "synth";
synth.id = "synth" + (counterSynth++);
applicationArea.appendChild(synth);
};
},
});
}
if (Meteor.isServer) {
Meteor.startup(function () {
// code to run on server at startup
});
}
最佳答案
您必须使用稍微不同的方法,基本上只是将您的东西插入集合中,并使用把手将其取出。我不确定您在做什么,但是您应该对以下内容有所了解
服务器js
synths = new Meteor.Collection('synths'); //This will store our synths
客户端js:
synths = new Meteor.Collection('synths'); //This will store our synths
Template.start.events({
'mousedown #submit' : function () {
var amount = document.getElementById("amount").value;
for(i=0;i<amount;i++) {
lists.insert({class:"synth", id:counterSynth});
}
},
});
Template.start.synth = function() {
return synths.find(); //This gives data to the html below
}
HTML:
{{#each synth}}
<div class="{{class}}" id="synth{{id}}">
Synth stuff here
</div>
{{/each}