javascript - 在 Ember.js 中使用 itemController 时可以有自定义 View 吗？

Question

在 Ember.js 中执行 {{#each array itemController="something"}} 时，有没有办法可以拥有自定义 View ？目前，Ember 检查器显示 Ember 正在使用“虚拟” View 。

例如，以下 Handlebars 不会发生任何警报:

<ul>
  {{#each model}}
      <li>
        {{name}}
        <ul>
          {{#each kids itemController="kid"}}
            <li>{{name}}? {{yelledName}}!</li>
          {{/each}}
        </ul>
      </li>
  {{/each}}
</ul>

以及以下 JavaScript:

App.KidController = Ember.ObjectController.extend({
  yelledName: Ember.computed('name', function() {
    return this.get('name').toString().toUpperCase();
  })
});

App.KidView = Ember.View.extend({
  // THIS NEVER HAPPENS!
  test: Ember.on('didInsertElement', function() {
    alert('didInsertElement on ThingView');
  })
});

这是一个代码笔，其中的代码(不)工作:http://cdpn.io/hveEA

看起来，Ember并没有尝试通过名称查找 View ，就像它是来自路由的 Controller 的 View 一样。相反，它只是呈现一个“虚拟” View ，如下面的屏幕截图所示。

Answer 1

使用这个有什么问题(它允许您使用 KidView):

{{#each kid in kids}}
{{render 'kid' kid}}
{{/each}}

我没有看到您使用任何模型属性。

模板:

<script type="text/x-handlebars" data-template-name="kid">
    <li>{{name}}? {{yelledName}}!</li>
</script>

查看:

App.KidView = Ember.View.extend({
  // THIS HAPPENS!
  test: Ember.on('didInsertElement', function() {
    alert('didInsertElement on ThingView');
  })
});

完整代码示例: https://gist.github.com/anonymous/8971543