Javascript 无法检索视图外部的集合

我正在制作一个简单的人员列表，当点击人员姓名时，路由器会将一个姓名作为参数'student/：name'，并在集合中找到一个合适的人员对象。我通过从服务器获取集合来实例化

GroupView

类中的集合。这就是错误出现的地方：为了在Router类中的

viewstustudent（）

方法中获得对集合的访问权（这样我就可以找到正确的对象），我又创建了一个

GroupView（）

的实例，控制台显示了一个错误，没错，因为集合中没有对象

我无法理解这一点，为什么在GroupView（）中我从服务器接收数据，而我的收集工作正常，但第二次我在路由器中实例化

GroupView（）

——没有收集？也许还有其他方法可以让我访问路由器中的收藏？任何帮助都将不胜感激

 var StudentModel = Backbone.Model.extend({
    defaults: {
        name: 'Volodya',
        lastName: 'Peterson',
        age: 22,
        gender: 'male'
    }
});

var StudentsCollection = Backbone.Collection.extend({
    model: StudentModel,
    url: '/students.json'
});

var StudentView = Backbone.View.extend({
    tagName: 'li',

    template: _.template($('#studentTpl').html()),

    events: {
        'click': function () {
            eventAggregator.trigger('student:selected', this.model);
        }
    },

    render: function () {
        this.$el.html(this.template(this.model.toJSON()));
        return this;
    }
});

var GroupView = Backbone.View.extend({
    tagName: 'ul',

    initialize: function () {
        this.collection = new StudentsCollection();
        this.collection.on('update', this.render, this);
        this.collection.fetch();
    },

    render: function () {
        var self = this;
        this.collection.each(function (student) {
            var studentView = new StudentView({
                model: student
            });
            self.$el.append(studentView.render().el);
        });
        $('body').html(this.$el);
    }
});

var RouterView = Backbone.View.extend({
    tagName: 'ul',

    render: function () {
        var self = this;

        _.each(this.model.toJSON(), function (value) {
            self.$el.append('<li>' + value + '</li>');
        });

        return this;
    }
});

var GroupController = function  () {
    this.start = function () {
        var groupView = new GroupView();
    };
};

var Router = Backbone.Router.extend({
    routes: {
        '': 'index',
        'student/:name': 'viewStudent'
    },

    index: function () {
        groupController.start();
    },

    viewStudent: function (name) {
        var groupView = new GroupView();
        var selectedStudent = groupView.collection.find(function (student) {
            return student.get('name') === name;
        });
        $('body').append((new RouterView({ model : selectedStudent})).render().el);
    }
});

var eventAggregator= _.extend({}, Backbone.Events),
    groupController;

$(function () {
    var router = new Router();

    groupController = new GroupController();
    Backbone.history.start();

    eventAggregator.on('student:selected', function (student) {
        var urlpath= 'student/'+ student.get('name');
        router.navigate(urlpath, {trigger: true});
    });
});

var StudentModel=Backbone.Model.extend({
默认值：{
名称：“沃洛迪亚”，
姓氏：“彼得森”，
年龄:22,，
性别：'男性'
}
});
var studentscolection=Backbone.Collection.extend({
模特儿：学生模特儿，
url:“/students.json”
});
var StudentView=Backbone.View.extend({
标记名：“li”，
模板：35;.template（$（'#studentTpl'）.html（）），
活动：{
“单击”：函数（）{
eventAggregator.trigger（'student:selected'，this.model）；
}
},
渲染：函数（）{
this.el.html（this.template（this.model.toJSON（））；
归还这个；
}
});
var GroupView=Backbone.View.extend({
标记名：“ul”，
初始化：函数（）{
this.collection=新学生集合（）；
this.collection.on（'update'，this.render，this））；
this.collection.fetch（）；
},
渲染：函数（）{
var self=这个；
此.collection.each（函数（学生）{
var studentView=新studentView({
模特儿：学生
});
self.$el.append（studentView.render（）.el）；
});
$（'body'）.html（this.$el）；
}
});
var RouterView=Backbone.View.extend({
标记名：“ul”，
渲染：函数（）{
var self=这个；
_.each（this.model.toJSON（），函数（值）{
self.$el.append（'
'+value+'
'）；
});
归还这个；
}
});
var GroupController=函数（）{
this.start=函数（）{
var groupView=新的groupView（）；
};
};
var Router=Backbone.Router.extend({
路线：{
“‘索引’，
“学生/：姓名”：“查看学生”
},
索引：函数（）{
groupController.start（）；
},
viewStudent:函数（名称）{
var groupView=新的groupView（）；
var selectedStudent=groupView.collection.find（函数（学生）{
返回student.get（'name'）==name；
});
$（'body'）.append（（新RouterView（{model:selectedStudent}））.render（）.el）；
}
});
var eventAggregator=..extend（{}，主干.Events），
组控制器；
$（函数（）{
var router=新路由器（）；
groupController=新的groupController（）；
Backbone.history.start（）；
eventAggregator.on（'student:selected'，函数（student）{
var urlpath='student/'+student.get（'name'）；
导航（urlpath，{trigger:true}）；
});
});

fetch

是一个AJAX调用，它不会从服务器返回并填充

new GroupView（）

和

GroupView.collection.find（…）之间的集合

调用，这样当您尝试

查找其中的内容时，集合将为空。那么在路由器中进行另一个AJAX调用以获取集合是否合适？（make fetch和inside of success函数放置viewStudent方法的所有功能）根据应用程序的结构，您可能可以使用相同的集合。或者只获取所需的单个模型，因为
RouterView
fetch
是一个AJAX调用，它不会从服务器返回并填充
new GroupView（）
和
GroupView.collection.find（…）之间的集合
调用，这样当您尝试
查找其中的内容时，集合将为空。那么在路由器中进行另一个AJAX调用以获取集合是否合适？（make fetch和inside of success函数放置viewStudent方法的所有功能）根据应用程序的结构，您可能可以使用相同的集合。或者只需获取所需的单个模型即可
RouterView
。