Backbone.js tắt quấn bởi div trong kết xuất

Question

Tôi có mô hình Bài đăng và bộ sưu tập Bài đăng. Và muốn tạo biểu mẫu với danh sách tất cả các bài đăng trong <select id="multi" multiple="multiple">. Vì vậy, tôi phải thực hiện một PostView render bên trong #multi của tôi chỉ với mẫu này:

<option value=""><%= title %></option> 

Nhưng cuối cùng tôi nhận được nó được bọc bằng div. Có giải pháp nào cho việc không gói mẫu này với <div> không?

Answer 1

Nếu bạn không xác định el (hoặc tagName) cho chế độ xem (trong lớp hoặc trong quá trình khởi tạo), chế độ xem sẽ được đặt bên trong thẻ div. http://documentcloud.github.com/backbone/#View-el

var PostView = Backbone.View.extend({ 
    tagName: 'option' 
}); 

CẬP NHẬT

Bắt đầu v0.9.0, Backbone có view.setElement (element) để thực hiện điều này.

var PostView = Backbone.View.extend({ 
    initialize: function() { 
     var template = _.template('<option value=""><%= title %></option>'); 
     var html = template({title: 'post'}); 
     this.setElement(html); 
    } 
}); 

Answer 2

Nếu bạn không muốn có quan điểm quấn HTML của bạn, bạn sẽ phải làm một vài điều:

1. Thay this.el hoàn toàn
2. Gọi delegateEvents trên mới el

render: function(){ 
    var html = "some foo"; 
    this.el = html; 
    this.delegateEvents(this.events); 
} 

Vì xương sống tạo ra div hoặc thẻ khác (dựa trên cài đặt tagName cho chế độ xem), bạn phải thay thế hoàn toàn thẻ đó. Thật dễ dàng để làm. Khi bạn làm điều đó, mặc dù, bạn mất các sự kiện được khai báo của bạn bởi vì Backbone sử dụng jQuery delegate dưới mui xe để dây chúng lên. Để bật lại các sự kiện đã khai báo của bạn, hãy gọi delegateEvents và chuyển vào các tuyên bố sự kiện của bạn.

Kết quả là view.el của bạn sẽ là thẻ <option> mà bạn muốn và không có gì khác.

Answer 3

Trong phiên bản 0.9.0, Backbone đã giới thiệu view.setElement(element) để xử lý thao tác này.