Javascript 主干集合-在集合级别合并两个集合

我的示例应用程序中有两个独立的集合。我试图做的是通过userId合并集合。我过去通常在渲染级别处理过这个问题，但是我真的希望在集合级别解析数据，如果愿意的话，让渲染变得“哑”，并简单地将数据传递给我的下划线模板

我遇到了一些线程，在那里回答了这个问题，但是我无法在收集级别完成这项工作

我在这里设置了一个plunker来更好地描述情况。

首先，我对用户集合执行一次提取，以获取所有用户ID和信息，以便使用训练集合进行解析

users.json

[
    {
        "user" : 53,
        "firstname" : "Todd",
        "lastname" : "Jones",
        "email" : "xxx@gmail.com",
        "avatar" : ""
    },
    {
        "user" : 53,
        "firstname" : "Sarah",
        "lastname" : "Thomas",
        "email" : "xxx@gmail.com",
        "avatar" : ""
    }
]       

[
    {
        "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"
    }
]       

tracker.json

[
    {
        "user" : 53,
        "firstname" : "Todd",
        "lastname" : "Jones",
        "email" : "xxx@gmail.com",
        "avatar" : ""
    },
    {
        "user" : 53,
        "firstname" : "Sarah",
        "lastname" : "Thomas",
        "email" : "xxx@gmail.com",
        "avatar" : ""
    }
]       

[
    {
        "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"
    }
]       

我在这篇文章中看到了一些例子

但是，我认为我的问题是，我试图错误地访问WorkoutCollection中的UserCollection，或者我没有将其解析为JSON对象（这发生在render函数中）

整个代码在下面，plunker在这里

提前感谢您提供的任何见解

// 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
});

---

我现在已经按照我希望的方式工作了

我最终做的是将用户集合传递给训练集合

然后，我可以轻松地使用下划线映射函数合并数据

usersLoaded: function() {

    var users = this.userCollection.toJSON();
    this.workoutCollection = new WorkoutCollection(users);
    this.listenTo(this.workoutCollection, "reset sync remove", this.render);
    this.workoutCollection.fetch({dataType: "json"});
    this.template = _.template($('#workout-table-template').html());

},

parse: function (responses) {

    var workouts = responses;
    var users = this.users;

    var mergedCollection = _.map(users, function (user) {  
        var workout = _.find(workouts, function (o) { 
            return o.userId == user.userId;
        }); 
        return _.extend(user, workout); 
    });


    _.each(mergedCollection, 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;
    });

  return mergedCollection;
}