2013-07-12 2 views
2

Я хочу создать образец страницы с помощью backbone.js, и я совершенно новичок в этом.Создание боковой панели с использованием backbone.js

Вид должен быть аналогичен показанному на веб-сайте backbone.js, где у вас есть боковая панель, а с правой стороны у вас есть контент. Как показано в этой ссылке: -

http://backbonejs.org/

Рассмотрим следующий сценарий: -

var model = Backbone.Model.extend({ 
     data:[ 
      {'title': 'Apple', 'logo':'images/apple.png', 'history': "Some history about  apple"}, 
      {'title': 'Google', 'logo':'images/google.png', 'history': "Some history about  google"}, 
      {'title': 'Microsoft', 'logo':'images/mirosoft.png', 'history': "Some history about microsoft"} 
] 
     ] 
    }); 

Теперь на мой взгляд, боковая панель должна содержать ссылки в виде списка, как

<a href="#apple">Apple</a> 
<a href="#google">Google</a> 
<a href="#microsoft">Microsoft</a> 

и с правой стороны я хочу увидеть логотип и историю Apple, которые прошли в приведенных выше данных.

Точно так же, когда кто-то нажимает на Google на время выполнения, я изменить содержимое на правой стороне боковой панели

Любые указания о том, как получить это ..?

ответ

1

Смотрите ниже ответ, чтобы получить основную идею о передаче параметров между видами:

Event handling between views

В принципе, вы должны зарегистрировать событие, которое при выстреле, будет повторно отображать ваше основное содержание:

ContentView = Backbone.View.extend({ 
    initialize: function() { 
     App.vent.on('show', this.show, this); 
    }, 
    show: function (company) { 
     // do something with your model, then call render() 
    } 
    // .... 
}); 

и вид боковой панели, который, как предполагается, чтобы вызвать это событие при нажатии на любую из ссылок:

SidebarView = Backbone.View.extend({ 
    events: { 
     '.companylink click': 'clicked' 
    }, 
    clicked: function (company) { 
     App.vent.trigger('show', company); 
    } 
    // ..... 
}); 
Смежные вопросы