我的示例應用程序中有兩個單獨的集合。我想要做的是將userId的集合聯合起來。我通常在渲染級別處理過,但是我真的想要在集合級別解析數據,並且如果您願意並簡單地將數據傳遞給我的下劃線模板,渲染將變得「啞巴」。骨幹集合 - 集合級別的Union 2集合
我遇到了幾個線程,在這個答案中,但我無法在集合級別完成此操作。
我已經在這裏設置了一個plunker來更好地描述情況。 http://plnkr.co/edit/UCAFycdmsLaD14cYgTdZ?p=preview
首先,我對用戶集合進行提取以獲取所有userId和用鍛鍊集合解決的信息。
users.json
[
{
"user" : 53,
"firstname" : "Todd",
"lastname" : "Jones",
"email" : "[email protected]",
"avatar" : ""
},
{
"user" : 53,
"firstname" : "Sarah",
"lastname" : "Thomas",
"email" : "[email protected]",
"avatar" : ""
}
]
tracker.json
[
{
"user" : 53,
"distance" : 3,
"duration" : 180000,
"date" : "November 27, 2014 09:45:00",
"felt" : "Tired at first"
},
{
"user" : 53,
"distance" : 3.256,
"duration" : 978600,
"date" : "November 28, 2014 10:15:00",
"felt" : "Great"
}
]
我已經在這個線程看到幾個例子How do I union/merge two Collections by their 'id' using UnderscoreJS
不過我相信我的問題是,我正在嘗試訪問WorkoutCollectio中的UserCollection n不正確,或者我沒有將其解析爲JSON對象(這發生在渲染函數中)。
整個代碼低於和plunker在這裏http://plnkr.co/edit/UCAFycdmsLaD14cYgTdZ?p=preview
預先感謝任何見解。
// Users Model
var Users = Backbone.Model.extend({
defaults: function() {
return {
avatar: "" // generic Avatar if none supplied by users
};
}
});
// Workouts Collection
var UserCollection = Backbone.Collection.extend({
model : Users,
url: '/data/users.json',
parse: function (responses) {
return responses;
}
});
// Workouts Model
var Workouts = Backbone.Model.extend({
defaults: function() {
return {
felt: "Good"
};
},
});
// Workouts Collection
var WorkoutCollection = Backbone.Collection.extend({
model : Workouts,
url: '/data/tracker.json',
parse: function (responses) {
var data = [];
_.each(responses, function(response){
// format durations
var x = response.duration;
var d = moment.duration(x, 'milliseconds');
var hours = Math.floor(d.asHours());
var mins = Math.floor(d.asMinutes()) - hours * 60;
var seconds = Math.floor(d.asSeconds()) - mins * 60;
var duration = "";
if (hours > 0) {
duration += hours + " hours ";
}
if (mins > 0) {
duration += mins + " minutes ";
}
if (seconds > 0) {
duration += seconds + " seconds ";
}
response.duration = duration;
// format workout dates
var y = response.date;
var z = moment(y).format('dddd, MMM Do YYYY');
response.date = z;
});
var result = [];
_.each(responses, function(el){
console.log(el)
console.log(UserCollection.get("user"))
_.extend(el,_.where(UserCollection, {user: el.user})[0] || {});
result.push(el);
});
console.log(result);
return responses;
}
});
// Main
var ExerciseApp = Backbone.View.extend({
el: "#exercise_app",
template: null,
initialize: function() {
this.userCollection = new UserCollection();
this.listenTo(this.userCollection, "reset sync remove", this.usersLoaded);
this.userCollection.fetch({dataType: "json"});
},
usersLoaded: function() {
this.workoutCollection = new WorkoutCollection();
this.listenTo(this.workoutCollection, "reset sync remove", this.render);
this.workoutCollection.fetch({dataType: "json"});
this.template = _.template($('#workout-table-template').html());
},
render: function() {
var workouts = this.workoutCollection.toJSON();
var users = this.userCollection.toJSON();
this.$el.html(this.template({workouts: workouts, users: users}));
},
});
$(document).ready(function() {
var app = new ExerciseApp
});