骨干无法读取属性'推送'未定义的

时间:2015-11-30 14:49:17

标签: backbone.js view push

我正在使用Backbone,当我生成视图时,我有错误无法读取属性' push'未定义"。错误的行是" self.subViewsReservas.push(新的ReservaView({"在推送中。

    ReservaCollectionView = Backbone.View.extend({

initialize: function () {
    if (Session.get('authenticated') && Session.get('authenticated') !== false) {
        this.paginacionVista = new PaginacionReservasView({
            collection: this.collection,
            el: '.paginacionReservas',
            reservasPagina: 5,
        });
        this.buscadorVista = new BuscadorView({
            el: 'div.buscador-reservas',
            //Pasamos la colección oficinas ya que hará las veces del conjunto de oficinas retornadas por el servidor
            collection: new OficinasCollection(oficinas),
        });
    }
    else {
    }
},
render: function () {
    var self = this;
    this.template = _.template($('#divReservaTpl').html(), {});
    self.$('.contenedor-reservas').empty();
    self.collection.each(function (reserva, index) {
        self.$('.contenedor-reservas').append(self.template({'data': reserva.toJSON()}));
    });
    this.collection.each(function (reserva, index) {
      this.subViewsReservas = [];
          self.subViewsReservas.push(new ReservaView({
              el: '#' + reserva.get('Idreserva'),
              model: reserva
          }));
    });
    this.collection.each(function (reserva, index) {
        //Limite de la paginacion 5 limite arbitrario
        if (index < 5) {
            //Lo Marcamos como visible y actualiazamos la paginación
            self.collection.get(reserva.get('Idreserva')).set({'Visibilidad': true});
        }
    });

    this.paginacionVista.render();

    return this;
},

});

AppView = Backbone.View.extend({
    initialize : function(){
            var self = this;

            self.usu = new UsuarioModel();
            self.usu.fetch({
                success: function (model){
                    Session.fetch({
                        success : function (){

                            Session.set('nombre',model.get('Nombre'));
                            Session.set('apellidos',model.get('Apellidos'));
                            Session.set('puntos_club',model.get('Puntosclub'));

                            self.render();
                        }
                    });

                    self.sideBar = new SideBarView({
                        el : '.sidebar',
                        model: model
                    });
                    self.sideBar.markOption('mis-reservas');
            AppView = Backbone.View.extend({
    initialize : function(){
            var self = this;

            self.usu = new UsuarioModel();
            self.usu.fetch({
                success: function (model){
                    Session.fetch({
                        success : function (){

                            Session.set('nombre',model.get('Nombre'));
                            Session.set('apellidos',model.get('Apellidos'));
                            Session.set('puntos_club',model.get('Puntosclub'));

                            self.render();
                        }
                    });

                    self.sideBar = new SideBarView({
                        el : '.sidebar',
                        model: model
                    });
                    self.sideBar.markOption('mis-reservas');
                },
                error : function (){
                    document.location = '/mygoldcar/login';
                }
            });            

            this.listenTo(Session, 'change', self.update);        
    },
    render : function(){
            var self = this;
            var reservas = new ReservasCollection();
            reservas.fetch({
                success: function (collection){
                    if ( typeof collection.models[0].get('error') == 'undefined' || !collection.models[0].get('error')) {
                        var listRes = new ReservaCollectionView({
                            el : '.reservas-list',
                            collection: collection   
                        });
                        listRes.render();

                        var popoverModel = new Popover();
                        popoverModel.setData(collection.models[0].get('kilometraje_ilimitado'), collection.models[0].get('duracion'));

                        self.popover = new PopoverView({
                            el: 'body',
                            model: popoverModel
                        });

                        self.popover.establecerPopover();
                    }
                    else document.location = '/mygoldcar' + self.urlLang(lang) + '/mi-cuenta/#msg/1';                    
                },
                error: function () {
                    document.location = '/mygoldcar' + self.urlLang(lang) + '/mi-cuenta/#msg/1';                    
                }
            });
    },
        update: function() {
            var self = this;
            self.sideBar.update(Session.get('nombre'),Session.get('apellidos'),Session.get('puntos_club'));   
            self.$el.find('.nombre-usuario').text(Session.get('nombre'));            
        },
        updatePoints: function() {
            var self = this;
            self.usu.fetch({
                success: function (model){
                    Session.set('puntos_club',model.get('Puntosclub'));
                }
            });
        }   
});    },
                error : function (){
                    document.location = '/mygoldcar/login';
                }
            });            

            this.listenTo(Session, 'change', self.update);        
    },
    render : function(){
            var self = this;
            var reservas = new ReservasCollection();
            reservas.fetch({
                success: function (collection){
                    if ( typeof collection.models[0].get('error') == 'undefined' || !collection.models[0].get('error')) {
                        var listRes = new ReservaCollectionView({
                            el : '.reservas-list',
                            collection: collection   
                        });
                        listRes.render();

                        var popoverModel = new Popover();
                        popoverModel.setData(collection.models[0].get('kilometraje_ilimitado'), collection.models[0].get('duracion'));

                        self.popover = new PopoverView({
                            el: 'body',
                            model: popoverModel
                        });

                        self.popover.establecerPopover();
                    }
                    else document.location = '/mygoldcar' + self.urlLang(lang) + '/mi-cuenta/#msg/1';                    
                },
                error: function () {
                    document.location = '/mygoldcar' + self.urlLang(lang) + '/mi-cuenta/#msg/1';                    
                }
            });
    },
        update: function() {
            var self = this;
            self.sideBar.update(Session.get('nombre'),Session.get('apellidos'),Session.get('puntos_club'));   
            self.$el.find('.nombre-usuario').text(Session.get('nombre'));            
        },
        updatePoints: function() {
            var self = this;
            self.usu.fetch({
                success: function (model){
                    Session.set('puntos_club',model.get('Puntosclub'));
                }
            });
        }   
});

1 个答案:

答案 0 :(得分:1)

collection.each内,this指向该集合。因此,属性subViewsReservas被添加到它,而不是视图实例。当您尝试像self.subViewsReservas.push那样访问它时,self指向视图实例,该实例没有subViewsReservas属性,因此出错。

each内初始化一个像你一样的数组并不会做很多事情,因为每次调用回调都会重置它。

您应该在initialize方法中初始化它,这是初始化事物的正确位置,其中this将正确指向视图实例,如下所示< / p>

initialize: function () {
  this.subViewsReservas = [];
}

出于某种原因,如果您希望每次都重置集合,您可以通过将其作为第二个参数传递给每个集合来更改要查看的上下文:

this.collection.each(function (reserva, index) {
  this.subViewsReservas = [];
      self.subViewsReservas.push(new ReservaView({
          el: '#' + reserva.get('Idreserva'),
          model: reserva
      }));
}, self); // <--- makes view the context of callback,
          // both 'self' and 'this' will refer to view