Mô hình Backbone.js với bộ sưu tập

Question

Tôi có 2 kiểu và một bộ sưu tập. JobSummary là một mô hình, JobSummaryList là một tập hợp các JobSummary mục, và sau đó tôi có một mô hình JobSummarySnapshot có chứa một JobSummaryList:

JobSummary = Backbone.Model.extend({}); 

JobSummaryList = Backbone.Collection.extend({ 
    model: JobSummary 
}); 

JobSummarySnapshot = Backbone.Model.extend({ 
    url: '/JobSummaryList', 

    defaults: { 
     pageNumber: 1, 
     summaryList: new JobSummaryList() 
    } 
}); 

Khi tôi gọi fetch trên đối tượng JobSummarySnapshot, nó được tất cả mọi thứ ... Trừ khi tôi di chuyển qua bộ sưu tập summaryList, tất cả chúng đều thuộc loại object và không phải là JobSummary.

Tôi cho rằng điều này có ý nghĩa vì khác với đối tượng defaults, nó không biết rằng summaryList phải thuộc loại JobSummaryList. Tôi có thể đi qua mỗi mục và chuyển đổi nó thành một đối tượng JobSummary, nhưng tôi đã hy vọng có một cách để làm điều đó mà không cần phải làm điều đó bằng tay.

Đây là mã thử nghiệm của tôi (làm việc jsfiddle here):

var returnData = { 
    pageNumber: 3, 
    summaryList: [ 
     { 
     id: 5, 
     name: 'name1'}, 
    { 
     id: 6, 
     name: 'name2'} 
    ] 
}; 

var fakeserver = sinon.fakeServer.create(); 
fakeserver.respondWith('GET', '/JobSummaryList', [200, 
{ 
    'Content-Type': 'application/json'}, 
           JSON.stringify(returnData)]); 

var callback = sinon.spy(); 


var summarySnapshot = new JobSummarySnapshot(); 
summarySnapshot.bind('change', callback); 

summarySnapshot.fetch(); 
fakeserver.respond(); 

var theReturnedList = callback.getCall(0).args[0].attributes.summaryList; 

_.each(theReturnedList, function(item) { 
    console.log('Original Item: '); 
    console.log(item instanceof JobSummary); // IS FALSE 
    var convertedItem = new JobSummary(item); 
    console.log('converted item: '); 
    console.log(convertedItem instanceof JobSummary); // IS TRUE 
}); 

UPDATE: Nó xảy ra với tôi rằng tôi có thể ghi đè lên các chức năng phân tích và thiết lập nó như vậy ... Tôi có này ngay bây giờ:

JobSummarySnapshot = Backbone.Model.extend({ 
    url: '/JobSummaryList', 

    defaults: { 
     pageNumber: 1, 
     summaryList: new JobSummaryList() 
    }, 

    parse: function(response) { 
     this.set({pageNumber: response.pageNumber}); 

     var summaryList = new JobSummaryList(); 
     summaryList.add(response.summaryList); 

     this.set({summaryList: summaryList}); 
    } 
}); 

Điều này hoạt động cho đến nay. Để câu hỏi mở trong trường hợp ai đó đã nhận xét về nó ....

Answer 1

Chức năng parse() của bạn không nên set() bất kỳ điều gì, thực hành tốt hơn để trả lại thuộc tính, Backbone sẽ cẩn thận thiết lập nó. ví dụ.

parse: function(response) { 
    response.summaryList = new JobSummaryList(response.summaryList); 
    return response; 
} 

Bất kể bạn trở về từ parse() là passed to set().

Không trở về bất cứ điều gì (mà cũng giống như trở về undefined) cũng giống như gọi set(undefined), mà có thể gây ra nó không vượt qua xác nhận, hoặc một số kết quả bất ngờ khác nếu tùy chỉnh của bạn validate()/set() phương pháp hy vọng sẽ có được một đối tượng. Nếu phương thức xác thực của bạn hoặc phương thức set() không thành công do đó, cuộc gọi lại options.success được chuyển đến Backbone.Model#fetch() sẽ không được gọi.

Ngoài ra, để làm điều này chung chung hơn, do đó set() ing đến một đối tượng đơn giản từ những nơi khác (và không chỉ từ các phản ứng máy chủ) cũng ảnh hưởng đến nó, bạn có thể muốn ghi đè set() thay vì:

set: function(attributes, options) { 
    if (attributes.summaryList !== undefined && !(attributes.summaryList instanceof JobSummaryList)) { 
     attributes.summaryList = new JobSummaryList(attributes.summaryList); 
    } 
    return Backbone.Model.prototype.set.call(this, attributes, options); 
} 

Bạn cũng có thể tìm thấy Backbone-relational thú vị - nó giúp việc xử lý các bộ sưu tập/mô hình lồng nhau bên trong mô hình trở nên dễ dàng hơn nhiều.

chỉnh sửa tôi quên trở về từ phương thức set(), mã hiện đang được cập nhật