3

下面我有一个带有数字输入表单的基本模板。当您在表单中键入一个数字并单击添加一个 Div 列表时，就会创建。Div 是使用“synth”类和“synth”+ 一个数字的 id 创建的。这些数字根据计数器连续排列。

我不仅想将这些信息存储在数据库中，而且这样做的方式是（最终）当用户登录时，他们可以访问他们的 Div 列表作为他们之前登录的“保存状态”。

我什至不确定我是否会以适当的方式处理这件事。我只是将 createSynth() 函数粘贴在 Collection 插入列表中。我有一种“正确”地做到这一点的感觉，我应该有两个并行工作的事件 - 一个发送到列表 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>

Javascript

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
  });
}
4

2 回答 2

0

您必须使用稍微不同的方法，基本上只是将您的东西插入集合中，然后使用把手将其取出。我不完全确定您在做什么，但是您应该对以下内容有所了解

服务器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}
于 2013-03-05T07:34:17.930 回答
0

最好每次在客户端需要 DIV 时动态地重新创建它们，这样 DIV 就不会存储在服务器上。如果您真的想在服务器上硬编码/存储 DIV，您只需将 HTML 作为字符串保存到 Meteor 集合中。

于 2014-01-08T00:33:13.857 回答