Question

我正试图通过点击按钮从数据库中检索单个随机文档。当页面加载时，它会获得一个文档并显示在网页上;但是，当我尝试单击按钮以检索另一个随机文档并在网页上显示时，它不起作用。

问题是将对象传递给html文件。是的，我是Meteor /模板系统的新手。

main.html中

<body>
<ul>
   {{#each resolutions}}
    {{> resolution}}
   {{/each}}
</ul>
</body>

<template name="resolution">
<li>
<span class="text">{{question}}</span><br>
<button type="button" name="button" class="change-question">Change Question</button>
<br>
</li>
</template>

main.js

  Template.resolution.events({
'click .change-question': function(event, instance){

  var collection_size = Resolutions.find().count();
  var random = Math.floor(Random.fraction() * collection_size);
  // choose a random item by skipping N items
  var item = Resolutions.findOne({},{
    skip: random
  });
  var objArray = $.makeArray(item);

  instance.question.set(objArray);
// window.alert("sometext" + objArray);
}
});

  Template.body.helpers({
  resolutions: function() {
    var collection_size = Resolutions.find().count();
    var random = Math.floor(Random.fraction() * collection_size);
    // choose a random item by skipping N items
    var item = Resolutions.findOne({},{
      skip: random
    });
    var objArray = $.makeArray(item);
    return objArray;
  }
  });

ERROR消息显示'无法读取未定义的属性集'。

感谢任何帮助。

Answer 1

您可以像这样使用Reactive Variable： main.html中

<body>
<ul>
   {{#each resolutions}}
    {{> resolution}}
   {{/each}}
</ul>
</body>

<template name="resolution">
   <li>
      <span class="text">{{questionData}}</span><br>
      <button type="button" name="button" class="change-question">Change  Question</button>
     <br>
   </li>
</template>

main.js

var questionData = new ReactiveVar(null);
Template.resolution.rendered = function () {
    questionData.set(this.data);
}
Template.resolution.events({
    'click .change-question': function (event, instance) {

        var collection_size = Resolutions.find().count();
        var random = Math.floor(Random.fraction() * collection_size);
        // choose a random item by skipping N items
        var item = Resolutions.findOne({}, {
            skip: random
        });
        var objArray = $.makeArray(item);

        questionData.set(objArray);
        // window.alert("sometext" + objArray);
    }
});
Template.resolution.events({
    questionData: function () {
        if(questionData.get()) {
           return questionData.get().question;
        }
    }
})
Template.body.helpers({
    resolutions: function () {
        var collection_size = Resolutions.find().count();
        var random = Math.floor(Random.fraction() * collection_size);
        // choose a random item by skipping N items
        var item = Resolutions.findOne({}, {
            skip: random
        });
        var objArray = $.makeArray(item);
        return objArray;
    }
});

Meteor - on按钮单击从数据库中检索单个文档并显示

1 个答案: