[英]pass current value of spacebars:this as argument to new helper in meteor/blaze
[英]Blaze template helper only returning on in a Spacebars each loop in Meteor/Mongo
我有一個助手,該助手應該找到與給定的月份和年份參數相對應的所有事件,並將它們作為數組循環返回以供模板循環。 看來我的助手雖然只是一年級的第一年,但沒有循環,我也不知道為什么。
這是模板:
<template name="list">
<ul id="ulShell">
{{#each year in getYears}}
<li class="liYear">
<h2>{{year}}</h2>
</li>
<ul class="ulSubShell">
{{#each month in (getMonths year)}}
<li class="liMonth">
<h3>{{month}}</h3>
</li>
<ul>
{{#each event in (getEvents month year)}}
<li>
<h4>{{dayOfWeek event.start}} – {{formatDate event.start}}</h4>
<div class="divEvent">{{event.title}} <span class="spanDep pull-right">{{event.department}}</span></div>
</li>
{{/each}}
</ul>
{{/each}}
</ul>
{{/each}}
</ul>
</template>
這是邏輯:
let monthNames = ["January", "February", "March", "April", "May", "June",
"July", "August", "September", "October", "November", "December"
];
let today = new Date();
//today.setDate(today.getDate());
let upcoming = {
start: {
$gt: today.toISOString()
}
}
let findYears = function(){
var selectedDep = Session.get('selectedDep');
var distinctYears = _.uniq(Events.find( { $and: [ upcoming, selectedDep ] }, {
sort: {start: 1}, fields: {start: true}
}).fetch().map(function(x) {
var d = Number(x.start.substring(0, 4));
return d;
}), true);
return distinctYears;
};
let findMonths = function(year){
var selectedDep = Session.get('selectedDep');
var query = {
start: {
$gt: new Date(year - 1, 11, 31, 21, 59, 59, 999).toISOString(),
$lt: new Date(year + 1, 0, 0, 22, 00, 00, 001).toISOString()
}
}
var distinctMonths = _.uniq(Events.find( { $and: [ upcoming, query, selectedDep ] }, {
sort: {start: 1}, fields: {start: true}
}).fetch().map(function(x) {
var d = Number(x.start.substring(5, 7));
return monthNames[d];
}), true);
return distinctMonths;
};
/////////// I think this is where the problem is. Maybe with the forEach() function?
let findEvents = function(month, year){
var selectedDep = Session.get('selectedDep');
var events = Events.find( { $and: [ upcoming, selectedDep ] }, {sort: {start: 1}}).fetch();
var finalEvents = new Array();
events.forEach(function(event){
var mDigits = monthNames.indexOf(month);
mDigits += 1
mDigits = mDigits.toString();
var yearMonthSlice;
if(mDigits.length === 1){
yearMonthSlice = year+"-"+"0"+mDigits;
}else if(mDigits.length === 2){
yearMonthSlice = year+"-"+mDigits;
}
var getStart = event.start.substring(0, 7);
if(yearMonthSlice === getStart){
finalEvents.push(event);
}
});
return finalEvents;
};
Template.list.onCreated( () => {
let template = Template.instance();
template.subscribe( 'events' );
});
Template.list.helpers({
getYears() {
foundYears = findYears();
return foundYears;
},
getMonths(year) {
foundMonthNames = findMonths(year);
return foundMonthNames;
},
getEvents(month, year) {
var foundEvents = findEvents(month, year);
return foundEvents;
},
formatDate(start) {
var dayNumber = start.substring(8, 10);
return dayNumber;
},
dayOfWeek(start) {
var days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
var x = Number(new Date(start).getDay());
var dayName = days[x];
return dayName;
}
});
該列表正像這樣在我的瀏覽器中呈現:
任何幫助將不勝感激。 我是這一切的新手,尤其是Blaze / Spacebars / Meteor / MongoDB
讓我們簡單地將示例簡化到最低限度, 假設日期存儲為日期而不是字符串!
我們將要:
的HTML:
<template name="list">
{{#each year in getYears}}
{{year}}
{{#each monthNumber in getMonths}}
{{monthName monthNumber}}
{{#each event in (getEvents monthNumber year)}}
{{start}}
{{/each}}
{{/each}}
{{/each}}
</template>
js:
Template.list.helpers({
getYears(){
const years = Events.find({},{sort: {start: 1}}).map(event=>event.start.getFullYear()));
return _.uniq(years)
},
getMonths(year){
const months = Events.find(
{start: {$gte: new Date(year,0,1), $lt: new Date(year+1,0,1)}},
{sort: {start: 1}})
.map(event=>event.start.getMonth()));
return _.uniq(months); // this returns integers in [0,11]
},
getEvents(monthNumber,year){
return Events.find(
{start: {$gte: new Date(year,monthNumber,1), $lt: new Date(year,monthNumber+1,1)}},
{sort: {start: 1}});
},
monthName(month){
return monthNames[month];
});
請注意,javascript Date()
類足夠聰明,可以在month > 11
時包裝年份,其余日期字段也是如此。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.