ember.js - 如何使用 Controller 和 View 组织 ember 应用程序

Question

什么是 Controller 、 View 和其他 ember 结构的良好组合，以将具有以下线框图中基本功能的应用程序放在一起？

我不是在寻找详细的实现，而是在寻找如何构建 Ember 应用程序以及如何将 Controller 、 View 、模板等推理为构建块的灵感。

我的假设是此屏幕位于 ContactsRoute 下而ContactsController是 ArrayController包含 Contact模型(选定状态只是 UI 而不是持久化)。

Answer 1

一些想法，因为我有类似的运行:

我在这里看到两个布局列:

左栏 : 是一个带有关联 Controller 的 TreeNavView。
如果您输入 #/contacts(和 #/contacts/)，则会选择它

右栏 : 带有关联 Controller 的 ContactsView。 View 很可能由较小的 View 原子(如输入控件等)组装而成。

关于 Controller 的特别说明:根据我的经验，您在 Ember 中或多或少被迫在 Controller 和 View 之间建立 1:1 的关系——因此共享 Controller 是一件坏事，很难管理。

应用程序 View 包含 HTML/CSS 布局，并且两列都有两个导出。

如何将相应的 View 渲染到 socket 中？
对于左列，我将直接从应用程序 View 模板“调用” View ，如下所示:

{{view App.TreeNav}}

我将通过相应的路由器映射填充“正确的 socket ”:

this.route('contacts', {path: '/contacts'});

和路线:

IB.ContactsRoute = Em.Route.extend({
    renderTemplate: function() {
          this._super();
          this.render('contacts', {into: 'application', outlet: 'secondCol'});
    }
});