2015-02-24 3 views
0

Я новичок в Backbone.js и с трудным временем получаю вложенные виды для отображения. Метод рендеринга режима входа в систему запускается, но в DOM ничего не добавляется. Кажется, что он не видит элементы из родительского представления.Вложенные обратные представления Не добавляется к DOM

elm.views.Navigation = Backbone.View.extend({ 

    render: function() { 
     this.$el.html(this.template()); 
     new elm.views.Login({model: this.model, el: '#login'}); 
     return this; 
    }, 

    events: { 
     'mousedown li': 'mouseDown', 
     'mouseup li': 'mouseUp', 
     'click .btn-login': 'login' 
    }, 

    mouseDown: function (e) { 
     $(e.currentTarget).addClass('active'); 
    }, 

    mouseUp: function() { 
     $('li').removeClass('active'); 
    }, 

    login: function() { 
     $(document).trigger('login'); 
     return false; 
    } 

}); 

elm.views.Login = Backbone.View.extend({ 

    initialize: function() { 
     this.render(); 
    }, 

    render: function() { 
     console.log("login render"); 
     this.$el.html(this.template(this.model.toJSON())); 
     return this; 
    }, 

    events: { 
     'click .login': 'login', 
     'click .logout': 'logout' 
    }, 

    login: function (e) { 
     $(document).trigger('login'); 
     return false; 
    }, 

    logout: function (e) { 
     $(document).trigger('logout'); 
     return false; 
    } 

}); 

В ответ на комментарий:

Вид навигации показываются внутри инициализатора маршрутизатора:

initialize: function() {   
    elm.user = new elm.models.Person(); 
    elm.navigationView = new elm.views.Navigation({model: elm.user}); 
    $("#pageContent").html(elm.navigationView.render().el); 
}, 
+0

c вы предоставляете более подробную информацию о том, как вы инициируете elm.views.Navigation? Backbone использует JQUERY и ищет элемент вокруг страницы, поэтому важно, как вы инициируете первое представление. [https://github.com/jashkenas/backbone/blob/master/backbone.js](https://github.com/jashkenas/backbone/blob/master/backbone.js#L1207) –

+0

как вы добавляете навигацию в DOM? – StateLess

+0

@NimaShahri См. Отредактированный вопрос выше. –

ответ

2

Вашего мнение навигации работает на отдельный узел DOM, который означает, что #login не может быть найден по вашему логину и поэтому не может быть заполнен.

Либо передать свой контейнер в качестве el аргумента на главной странице:

elm.navigationView = new elm.views.Navigation({ 
    model: elm.user, 
    el: "#pageContent" 
}); 
navigationView.render(); 

http://jsfiddle.net/nikoshr/L1wp4vds/ для демонстрации

или сферу ваш суб элемент к элементу, используемому на главной странице:

elm.views.Navigation = Backbone.View.extend({ 
    render: function() { 
     this.$el.html(this.template()); 
     new elm.views.Login({el: this.$('#login')}); 
     return this; 
    } 

    ... 
}); 

http://jsfiddle.net/nikoshr/L1wp4vds/1/

Смежные вопросы