2012-07-30 7 views
5

Ich habe einen FullCalendar in einem Twitter Bootstrap Tab in einer JS-Anwendung in Ember geschrieben. Der Inhalt der Registerkarte enthält die folgenden Lenker.FullCalendar mit Ember und Twitter Bootstrap

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="commands pull-left"> 
      <input type="text" placeholder="Display Calendar for" data-provide="typeahead"> 
     </div> 
     <div class="commands pull-right"> 
      <a {{bindAttr class=":btn :btn-primary"}} href="#" {{action "newEvent"}}><i class="icon-plus icon-white"></i> Add Event</a> 
     </div> 
    </div> 
    <hr/> 
    <div class="row-fluid"> 
     {{#view App.CalendarTool id="calendar" class="calendar"}} 
     {{/view}} 
    </div> 
</div> 

Die Klasse App.CalendarTool ist wie folgt definiert:

require('fullcalendar/fullcalendar'); 
require('fullcalendar/gcal'); 

App.CalendarTool = Em.View.extend({ 
    tagName:'div', 
    attributeBindings:['id','events','owner'], 
    classNamesBindings:['class'], 
    didInsertElement:function(){ 

     this.$().fullCalendar({ 
      header: { 
       left: 'prev,next today', 
       center: 'title', 
       right: 'month,agendaWeek,agendaDay ' 
      }, 
      editable: true, 
      events: [] 
     }); 

    } 

}); 

Wenn die Seite geladen wird, wird die fullcalendar nicht kommen. Nur Schaltflächen in der Spitze kommen auf. Wenn ich heute drücke, erscheint der Vollkalender.

JSFIddle - http://jsfiddle.net/uMVyu/

+1

Haben Sie jemals überhaupt Ihre Implementierung erweitern? Insbesondere versuche ich, den besten Weg zu finden, Vollkalender-Events an Ember-Datenobjekte zu binden –

Antwort