Question

我有以下路线

App.Router.map(function(match) {
    this.route("days", { path: "/" });
    this.resource("day", { path: "/:day_id" }, function() {
        this.resource("slots", { path: "/slots" }, function() {
            this.resource("slot", { path: "/:slot_id" }, function() {
                this.route("edit", { path: "/edit" });
            });
        });
    });
});

我有以下

的模板

script/app/templates/application.handlebars
script/app/templates/days.handlebars
script/app/templates/day.handlebars
script/app/templates/day/index.handlebars
script/app/templates/slots.handlebars
script/app/templates/slots/index.handlebars
script/app/templates/slot.handlebars
script/app/templates/slot/index.handlebars
script/app/templates/slot/edit.handlebars

是以上正确的
如果我打算执行以下操作（不包括天数），每个把手模板中的html应该是什么
我需要定义哪些路线，假设我想要执行以下操作（不包括天数）
- 当选择一天时，我想显示相关模型的列表（在这种情况下是插槽）
- 当选择一个插槽时我想要html来自它是索引页面（根据插槽ID显示单个插槽） param传递给路线）

更新

到目前为止，看起来标有“资源”的路线需要{{outlet}}可用于内部资源或路线以放弃某些标记。

例如day.handlebars模板有一个{{outlet}}，在我的day / index.handlebars模板中，我放入一个for循环来显示每一天。接下来在slots.handlebars模板中我包含了一个{{outlet}}，在slots / index.handlebars模板中，我添加了另一个for循环来显示每个可用的插槽。

Answer 1

添加到Jakub的答案 - 在嵌套资源的情况下，通常（当您希望子项呈现在父项上时） xyz.handlebars 应该只包含插座和您想要的任何html xyz模板的一部分应该进入 xyz / index.handlebars 。这是因为每当你回到父资源时它都不会被重新渲染，因为ember假定它一直存在。但兄弟姐妹将永远被重新渲染，在你的情况下是插槽/索引和插槽/编辑

关于路线，任何必须有孩子的东西都是资源。在你的情况下 主机/＃/天和主机/＃/日都会呈现在应用程序商店

Answer 2

这就是

script/app/templates/application.handlebars - {{outlet}}
script/app/templates/days.handlebars - template, but it should be a `resource` 
                                       instead of a route, which results in this
script/app/templates/days/index.handlebars - will be rendered on `/days`


script/app/templates/day.handlebars - {{outlet}} inserted into `application` outlet
script/app/templates/day/index.handlebars - inserted into `day` outlet

script/app/templates/slots.handlebars - {{outlet}} inserted into `day` outlet
// this also overwrites `day/index` template, so only one of them 
// can be displayed at once

script/app/templates/slots/index.handlebars - inserted into `slots` outlet
script/app/templates/slot.handlebars - {{outlet}} inserted into `slots` outlet
script/app/templates/slot/index.handlebars - inserted into `slot` outlet
script/app/templates/slot/edit.handlebars - inserted into `slot` outlet

您还应该将days定义为资源

this.resource("days", { path: "/" });

它对其他路线没有任何影响，这条路线仍然有效

this.resource("day", { path: "/:day_id" } ...

如何为高度嵌套的ember.js路由结构连接出口

2 个答案: