Javascript EmberJS嵌套视图和控制器

我正在用EmberJS v1.0.pre编写一个应用程序。我有一个

ArrayController

，其中包含所有人员的列表。有一组嵌套视图，显示人、他们的宠物以及每个宠物的注释

|----------------------------------------|
| John                                   | <- Person
|----------------------------------------|
|   Quincy (Dog)                         | <- Pet
|     - Super ornery                     | <- Note
|     - Likes XYZ Dog food               |
|     - Will eat your socks              |
|                                        |
|   Tom (Cat)                            |
|    - Always (not) catching mice        |
|                                        |
|----------------------------------------|
| Roger                                  |
|----------------------------------------|
|   V (Dog)                              |
|    - Likes XYZ Dog food                |
|    - Sneezes, but it's ok              |
|                                        |
|----------------------------------------|
| ...                                    |

这让我感觉很糟糕，视图不应该是数据的权威来源。我的假设是，ArrayController将实例化

itemControlerClass

以及

itemViewClass

更新：为了更好地说明我的问题，我创建了一个。该功能故意不完整，目的是在单击列表中的某个项目时增加内容，从而完成该功能

---

更新：对不起，我意外删除了小提琴！我正在做一些关于最终解决方案的工作，所以我将尝试创建一个新的小提琴和解决方案。

您应该使用outlets。 它们是余烬视图中的小“占位符”，可以用不同的控制器处理

在上面的链接上有一个关于它们的合理解释，你已经检查过了，但是没有发现任何东西。但在你回到这一点之前，请先阅读以下内容：

如果其中任何一个仍然对您没有帮助，请告诉我，我将为您制作一个AxSample。

我认为这就是您要寻找的，看一看，这非常简单，您也可以查看示例。基本上，你可以通过插座、路由器和连接所有插座的操作来实现你想要的

“从纯MVC的角度来看，感觉每个孩子都应该有一个控制器”

您不需要为每个项目使用控制器，而是为每个对象集合（人、宠物、笔记）使用ArrayController。顺便说一下，对子对象（狗、注释）的任何操作都不应传递给

App.personcontroller

。这将违反原则

Ember.Router文档涵盖了希望在单个对象中嵌套视图的情况（例如

/：people\u id

）。但您希望嵌套对象数组的视图。我想不出嵌套

{{outlet}}

视图的方法，但您可以执行以下操作：

在3个ArrayController中加载对象People、Pets、Notes，并将子对象上的操作委托给相应的ArrayController

// in the view
click: function () {
  this.get('controller').updateNote(this.get('content'))
}

App.Router = Ember.Router.extend({
  root: Ember.Route.extend({
    route: '/',
    persons: Ember.Route.extend({
        connectOutlets: function(router) {

          router.get('applicationController').connectOutlet('persons');
          // App.Note.find() fetches all Notes,
          // If you are not using ember-data, make sure the notes are loaded into notesController
          router.set('notesController.content', App.Note.find());
          router.set('petsController.content', App.Pet.find());
        }
    })
  })
});

然后您的

人员

模板应该如下所示：

{{#each person in people}}
  <h1>My name is {{person.name}}</h1>

  {{#each pet in person.pets}}
     I have a pet with name {{pet.name}}
     <a {{action delete pet target="App.router.petsController">Delete pet</a>
  {{/each}}      

  {{view Ember.TextField valueBinding="myNewPetName" type="text"}}
  <a {{action create myNewPetName person target="controller"}}>
    Add a new pet for this person
  </a>


  {{#each note in person.notes}}
    <!-- delete, create, edit ... -->
  {{/each}}

---

我是新来的灰烬，一直在寻找一种方法来做类似的事情。在顶级ArrayController中，我只使用了

itemController

属性，效果非常好：

App.PeopleController = Ember.ArrayController.extend({
    itemController: "Person"
});

App.PersonController = Ember.ObjectController.extend //...

---

我的完整解决方案是。不幸的是，我让

PetController

实例工作的方式对我来说似乎有点老套。

仔细看看，指南中没有关于我的问题的确切信息。我以前读过它，我会继续参考它，但还没有找到任何东西。看看这个，然后我读了，它非常有用。但是，仍然没有用。我已经读了这两篇文章，甚至在我的帖子之前。我也使用插座，但插座不会将内容的责任委托给单独的控制器。谢谢你提供一个例子，我很想看看。为了更好地解释我的问题，我还将在JSFIDLE中编写一些东西。谢谢你一直以来的帮助，我再试试看。这篇文章，也得到了很大的帮助。我想我的问题是使用ArrayController。什么时候它真的应该只是一个带插座的控制器？这有意义吗？你有没有可能提供一个不同的、更相关的例子？你提供的那个和我的问题没有任何相似之处。具体来说，我的问题不在于路由，而在于将控制权委托给嵌套资源。插座很有趣，但即使有所有使用它们的建议，仍然没有关于它们如何解决我的问题的有用示例。这是我见过的关于我的问题的最完整的示例，谢谢！我将接受这个答案，并用它来运行。不过，我仍有一些问题需要解决。我对这个问题的最初抱怨是从观点中传递上下文，但这似乎是不可避免的。此外，控制器不能简单地设置为所有注释，因为它们是（字面上嵌入）宠物的子对象，宠物和人也是如此。对我来说，这并不是一个架构问题。我想我需要先设置父上下文。我将用我发现的更多信息更新我的问题。再次感谢。自v1.0pre版以来的更新非常有用，我的运气好得多。我会深入了解你所做的事情，看看进展如何！

App.PeopleController = Ember.ArrayController.extend({
    itemController: "Person"
});

App.PersonController = Ember.ObjectController.extend //...