2017-07-03 4 views
0

私は与えられた月と年の引数に対応するすべてのイベントを見つけ出し、それらをループするテンプレートの配列として返すヘルパーを持っています。私のヘルパーは、ループしているのではなく、年の最初のインスタンスに戻っているだけなので、理由はわかりません。ここでBlazeテンプレートヘルパーは、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; 
    } 
    }); 

リストは次のように私のブラウザで胸が張り裂けるさ:

Screen shot of list

すべてのヘルプは次のようになり非常に高く評価。 Blaze/Spacebars/Meteor/MongoDBの初心者です。

+0

なぜ、日付ではなく文字列に基づいてクエリを実行していますか?つまり、なぜあなたのクエリで '.toISOString()'を使用していますか? –

答えて

2

文字列ではなく日付として日付が格納されていると仮定して、ブレイズの最小限まで簡略化してみましょう。

  • 我々は
  • 見ている年に対応する番号を独特月のリストを表示して下さいすべてのイベントに対応するユニーク年のリストを表示して下さい

    1. は、我々はするつもりです

    2. その月と年の組み合わせに含まれるすべてのイベントを見つける
    3. できるだけ小さな数値で計算する文字列操作

    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:JavaScriptのDate()クラスは年間ラップするために十分にスマートであることを

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

    注際month > 11 - 残り日付フィールドのための同上。

    +0

    カオスに命令を出すためのupvote。 – zim

    関連する問題