Ember 2.3 如何在每个循环中使用 itemControllers？

Question

在任何人提出组件之前，我必须声明我知道 Ember 正在完全摆脱控制器和视图并采用组件结构。现在，我不得不使用此处提供的 legacy-controller 和 legacy-view 插件在 ember2.3 中使用控制器/视图：

https://github.com/emberjs/ember-legacy-controllers

https://github.com/emberjs/ember-legacy-views

作为升级到 Ember 2.3（从 1.7）过程的一部分。

现在，我有一个名为 recordTypes 的路由，它列出了所有的 recordType。在遗留代码中，每个 recordType 然后与 itemController 'recordType' 相关联。像这样：

{{#each result in searchResults itemController="recordType"}}
...
{{/each}}

令人惊讶的是，Ember 的这种旧式语法并没有向页面呈现任何内容，但下面的语法却做到了：

{{#each searchResults itemController="recordType" as |result| }}
 ...
{{/each}}

itemController recordType 是一个旧的对象控制器，而 recordTypes 控制器本身是一个旧的数组控制器。

现在，对于每个结果，我都有一些可以执行的操作。例如，单击结果时，将触发 editResultName 操作。此操作在旧代码中位于 recordType 控制器中。因此，单击 recordTypes 页面中的项目会将此操作推迟到 recordType 控制器，然后愉快地处理剩下的。

这不会在 ember2.3 中触发，即使使用旧版控制器也是如此。更让我惊讶的是，这段代码可以在 ember-legacy-controller.js 中找到

export default {
  name: 'ember-legacy-controllers',
  initialize: function() {
    /**
      Adds support for ArrayController in the legacy {{each}} helper
    */
    Ember._LegacyEachView.reopen({
      _arrayController: computed(function() {
        var itemController = this.getAttr('itemController');
        var controller = get(this, 'container').lookupFactory('controller:array').create({
          _isVirtual: true,
          parentController: get(this, 'controller'),
          itemController: itemController,
          target: get(this, 'controller'),
          _eachView: this,
          content: this.getAttr('content')
        });

        return controller;
      }),

      _willUpdate(attrs) {
        let itemController = this.getAttrFor(attrs, 'itemController');

        if (itemController) {
          let arrayController = get(this, '_arrayController');
          set(arrayController, 'content', this.getAttrFor(attrs, 'content'));
        }
      }
    });

  }
};

在这里，它确实有一行引用了 itemController。但是，当呈现此 searchResults 列表并单击 result 时，我得到的错误是：

 Nothing handled the action 'editResultName'. If you did handle the action, this error can be caused by returning true from an action handler in a controller, causing the action to bubble.

该动作确实存在，但 itemController 中的任何内容都没有被识别。不幸的是，我正在更新的许多遗留代码都有 itemController 循环，因此暂时能够使用 itemController 将非常有帮助。

我怎样才能像以前那样使用 itemController？

Answer 1

替换一个 itemController。

从each 助手中的内容创建一个组件。 itemController 将成为组件的js 侧，模板代码为template

从这里：

{{#each result in searchResults itemController="recordType"}}
  <span>result: {{result.title}}</span>
{{/each}}

对此：

{{#each searchResults as |result| }}
  {{result-list-item result=result}}
{{/each}}