如何处理 itemController 中特定于 DOM 的东西？答案

【问题标题】：how to deal with DOM-specific stuff in an itemController?如何处理 itemController 中特定于 DOM 的东西？
【发布时间】：2014-09-25 20:13:36
【问题描述】：

我有一个 Ember DS.Model 类别，其中包含许多度量，这些都显示在引导手风琴中，其中类别名称是面板标题，并且每个度量都有可选按钮。在我的模板中，我有一个 V 形，它要么指向右侧，要么指向下方，具体取决于该手风琴面板是否打开/关闭。我想响应手风琴的引导打开/关闭事件，这将是shown.bs.collapse 和hidden.bs.collapse 事件，并在glyphicon-chevron-right 和glyphicon-chevron-down 之间切换面板标题中的图标。

我的图标在 itemController 中：

<div class="panel-group" id="measureSelectors">
  {{#each itemController='dashboard-category'}}
    <!-- ... -->
    <i class="panel-chevron glyphicon glyphicon-chevron-right"></i>
    <!-- ... -->
  {{/each}}
</div>

我假设我只能响应视图中的引导事件，但我不确定如何将视图与 itemController 连接。如何收听活动并更改课程？

还有其他情况，我需要在 itemController 中执行特定于 DOM 的操作（例如，调用 jQuery 函数、加载 d3 可视化），因此我正在寻找可以在不同情况下应用的基本策略。我希望我可以创建一个 App.DashboardCategoryView 类，这样就可以了，但显然不行。

【问题讨论】：

标签： twitter-bootstrap ember.js

【解决方案1】：

使用渲染，它会将其包装在与传入的模板关联的视图和控制器中。

{{#each }}
  {{render 'dashboard-category' this}}
{{/each}}

将使用 DashboardCategoryView 和 DashboardCategory 控制器并将其作为控制器的模型传入。

http://emberjs.jsbin.com/muzeri/1/edit

【讨论】：