2012-07-30 34 views
5

Tôi đã triển khai một FullCalendar trong một tab Bootstrap Twitter trong một ứng dụng JS được viết bằng Ember. Nội dung của tab có các Handlebars sau đây.FullCalendar với Ember và 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> 

Các App.CalendarTool lớp được định nghĩa như sau:

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

    } 

}); 

Khi tải trang, các fullcalendar không đến lên. Chỉ các nút ở trên cùng mới xuất hiện. Khi tôi nhấn hôm nay, toàn bộ lịch biểu sẽ hiển thị.

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

+1

Bạn đã bao giờ mở rộng thực hiện tại tất cả? Cụ thể, tôi đang cố gắng tìm ra cách tốt nhất để ràng buộc các sự kiện fullcalendar để xóa các đối tượng dữ liệu –

Trả lời

Các vấn đề liên quan