1

今天我第四次阅读Trek 的教程，希望这次我能明白（不要误会，这是一个很棒的资源，但我一般是客户端开发的新手，发现该教程更适合专家）。无论如何，我注意到了这段代码：

<script type="text/x-handlebars" data-template-name="contributors">
  {{#each person in controller}}
    {{person.login}}
  {{/each}}
</script>

很明显，我们在这里迭代控制器中的槽项并将它们称为person每次迭代中的内部。但是controller参考从何而来？这是由 Ember 定义并在每个视图的上下文中可用的一些特殊关键字吗？

如果controller是 Ember 提供的特殊参考，我想更多地了解它是如何工作的。您能否指出我定义了此类关键字的文档甚至 Ember 源，以便我可以从视图中了解哪些其他参考可用以及它们是如何工作的？

4

1 回答 1

2

不，它不是一个特殊的关键字，它只是使用下面描述view的方法时设置的属性：connectOutlet

index: Ember.Route.extend({
  route: '/',
  connectOutlets: function(router){
    router.get('applicationController').connectOutlet('allContributors', [
      {login:'wycats'},
      {login:'tomdale'}
    ]);
  }
})

如果您阅读下面的示例，您会看到：

控制器有能力在他们控制的视图中连接出口。在上面的示例中，我使用 'allContributors' 作为参数调用 connectOutlet。这将为我们创建一个 AllContributorsView 的实例，将 AllContributorsController 的共享实例设置为视图的默认渲染上下文，并将其插入到我们的视图层次结构中 {{outlet}} 出现在应用程序模板中的位置。第二个参数，我硬编码为两个对象字面量的数组，设置为控制器实例的内容。

所以connectOutlet方法：

  • 创建一个实例AllContributorsView
  • 设置AllContributorsController为视图的默认渲染上下文（意思是controller视图的属性设置为App.router.allContributorsController，因为默认的视图渲染上下文是它的控制器，或者没有设置控制器时它的父视图上下文，见视图上下文源码。
  • {{outlet}}在出现的地方插入视图
  • 设置AllContributorsController实例的内容（这里[{login:'wycats'}, ...]）

我建议你完整阅读这篇文章，然后尝试自己做。您还可以阅读很多 Ember 资源，请参阅此 StackOverflow 答案。

于 2012-10-04T10:30:47.360 回答