如何渲染视图与骨干木偶 [英] How to render view with Backbone Marionette

问题描述

我使用Backbone.Marionette，需要渲染的员工和他们各自部门的景色。我希望它看起来像这样：

I'm using Backbone.Marionette and need to render a view of employees and their respective departments. I want it to look something like so:

Department 1
***

Employee1

Employee2

Employee3


Department 2
***
Employee4

Employee5

Employee6

Employee7

Employee8



Department 3
***
Employee9

Employee10

我的收藏是这样的​​：

My collection looks like this:

Employee1 / Department1

Employee2 / Department1

Employee3 / Department1

Employee4 / Department2

Employee5 / Department2


etc.

由于部门的变化，我需要渲染部门标题。

As the department changes I need to render the department heading.

哪个视图类型，我会用的组合。 Col​​lection视图，组合视图。我需要把逻辑视图/模板？

Which combination of view types would I use. Collection view, Composite view. Would I need to put logic in the view/template?

推荐答案

最终的结果可以分解很容易，来决定使用什么样的视图类型。

The end result can be broken down fairly easily, to determine what view types to use.

您有要渲染部门的集合。 A 的CollectionView 将解决这个问题，让每个部门它自己被渲染。

You have a collection of Departments that you want to render. A CollectionView would handle this, allowing each department to be rendered on it's own.

该部门本身具有复杂的需求。它需要显示标题（部门名称）和一些细节 - 员工列表。这听起来像一个包装模板......一个CompositeView中的一个集合视图。

The department itself has complex needs. It needs to show a header (the department name) and some detail - a list of employees. This sounds like a collection view with a wrapper template... a CompositeView.

每个部门的复合视图，则需要呈现的员工的名单。员工信息似乎相当简单，所以一个ItemView控件就足够了。

Each department's composite view then needs to render a list of employees. THe employee information seems fairly simple, so an ItemView would suffice.

最终的结果将是：

CollectionView
  - CompositeView (department)
    - ItemView (employee)

...当然实际的数据结构不适合这个布局，因为你的关系倒在那里的员工知道它属于哪个部门工作得很好。你要么需要反转的数据/关系，使各部门知道他们有在服务器上哪些员工/返回的JSON，或者做一些客户端的过滤和分组到达那个结果。

... Of course your actual data structure doesn't work very well for this layout because you have the relationship inverted where employee knows what department it belongs to. You'll either need to invert the data / relationship so that departments know what employees they have on the server / returned JSON, or do some client side filtering and grouping to get to that result.

这篇关于如何渲染视图与骨干木偶的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！