我是Meteor的新手,我想創建一個幻燈片放映來自集合中的項目,在這個例子中是簡單的單詞。幻燈片放映應由後退和前進按鈕控制,並替換當前字詞。如何返回集合中的項目數量?
在JavaScript/jQuery中,我會創建一個對象數組和一個控制索引,並通過if語句限制,所以索引永遠不會低於零或溢出數組長度。
的工作示例見琴:
http://jsfiddle.net/j0pqd26w/8/
$(document).ready(function() {
var wordArray = ["hello", "yes", "no", "maybe"];
var arrayIndex = 0;
$('#word').html(wordArray[arrayIndex]);
$("#previous").click(function(){
if (arrayIndex > 0) {
arrayIndex -= 1;
}
$('#word').html(wordArray[arrayIndex]);
});
$("#next").click(function(){
if (arrayIndex < wordArray.length) {
arrayIndex += 1;
}
$('#word').html(wordArray[arrayIndex]);
});
});
流星
我很好奇如何在流星關於最佳實踐實現這一點,並遵守此反應模式因爲我仍然試圖圍繞這個有趣的框架來解決問題。我的第一個障礙就是翻譯的
if (arrayIndex < wordArray.length)
// to
if (Session.get("wordIndex") < ((((length of collection))))
按照文檔我應該做一個找上了收藏,但我只管理後來與獲取返回一個空數組。對不起,如果這很長,但任何輸入將不勝感激,以幫助我解決這個問題。
collection.find([selector], [options])
cursor.fetch()
這是我到目前爲止的代碼:
Words = new Mongo.Collection("words");
if (Meteor.isClient) {
// word index starts at 0
Session.setDefault("wordIndex", 0);
Template.body.helpers({
words: function() {
return Words.find({});
},
wordIndex: function() {
return Session.get("wordIndex");
}
});
Template.body.events({
"submit .new-word": function (event) {
// This function is called when the word form is submitted
var text = event.target.text.value;
Words.insert({
text: text,
createdAt: new Date() //current time
});
// Clear form
event.target.text.value = "";
// Prevent default form submit
return false;
},
'click #previous': function() {
// decrement the word index when button is clicked
if (Session.get("wordIndex") > 0) {
Session.set("wordIndex", Session.get("wordIndex") - 1);
}
},
'click #next': function() {
// increment the word index when button is clicked
if (Session.get("wordIndex") < 10) {
Session.set("wordIndex", Session.get("wordIndex") + 1);
}
}
});
}
if (Meteor.isServer) {
Meteor.startup(function() {
});
}