从信息栏中的侧边栏中显示所选模型 [英] Display selected model from sidebar in information bar

问题描述

我正在开发一个右侧有侧边栏的应用程序.那显示集合.集合的每个模型都有 select 行为.

I'm working on a application which has sidebar on the right side. That displays collection. Each model of the collection has select behavior.

在页面的顶部中心，我有一个独立的主干视图，它的作用类似于信息栏"，当我选择侧栏中的一个视图时，该视图应该更新它的信息

In the top center of the page I have one independant backbone view which acts like "info bar" and this view should update it's infomation when I select one of the views in the sidebar

我该怎么做?我认为侧边栏中的每个视图都应该有带有模型参数的选择"事件，我的问题是如何在 Backbone.js 的信息栏视图中收听该更改???

How can I do it? I think that the each view in the sidebar should have "selected" event with model argument, and my question is how can I listen that change in my info bar view in Backbone.js???

推荐答案

这听起来很适合事件聚合器模式.德里克·贝利 (Derick Bailey) 就此事发表了一篇非常好的文章，您可以在此处阅读.

This sounds like something that would be served well by an event aggregator pattern. Derick Bailey posted a really nice article on this matter which you can read here.

事件聚合器模式

我扩展了我的 Backbone.View 以便所有视图都可以像这样使用事件聚合器对象.

I extended my Backbone.View so that all views have the event aggregator object available to them like this.

Backbone.View.prototype.eventAggregator = _.extend({}, Backbone.Events);

基本上当你的模型视图被选中时，你的 view.eventAggregator 会触发一些自定义事件.

Basically when your model view is selected, your view.eventAggregator will trigger some custom event.

sidebarView.eventAggregator.trigger('selected', this.model);

或者类似的东西.使用 Backbone 事件，您可以通过触发器函数将参数传递给您的事件侦听器.在上面的例子中，我传递了带有特定事件的模型.

or something of this sort. With Backbone events, you can pass parameters through the trigger function to your event listener. In the above example I passed the model with the specific event.

在您的主视图中，您将监听此事件.

In your main view, you'd be listening for this event.

mainView.eventAggregator.on('selected', myFunction, this);

myFunction: function(model) {
    // Some code to execute - model is available through param
}

这是一个非常有用的模式.只是不要忘记在关闭 mainView 时取消绑定事件.:-)

It's a pretty useful pattern. Just don't forget to unbind the event when you close out your mainView. :-)

这篇关于从信息栏中的侧边栏中显示所选模型的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！