Ember.js 用于嵌套资源的EmberJS呈现模板

我的余烬路由器看起来像下面

App.Router.map(function() {
    this.resource('projects', function () {
        this.resource('listings', { path: '/:project_id/listings' }, function() {
            this.route('listing', { path: '/:listing_id' });
        });
    });         
});

我有2个模板（项目、列表）。项目模板有一个

{{{#link to}}

帮助程序，它向清单资源添加了一个锚。项目模板工作正常。

{{#link to}

助手似乎也正确地生成了

url

（~/projects/2/listings）

现在列表已正确呈现，但它们是在项目模板中呈现的。我假设这是因为资源是嵌套的。因此，我删除了嵌套，并将项目和列表作为它们自己的资源

App.Router.map(function() {
    this.resource('projects');          
    this.resource('listings', { path: 'projects/:project_id/listings' }, function() {
            this.route('listing', { path: '/:listing_id' });
    });
});

问题是，当路由转换为列表时，列表模板不会呈现。只是一片空白。下面的小提琴演示了这个问题

---

Fiddle:

要想做你想做的事，就按照你开始的方式来组织你的路线

App.Router.map(function() {
    this.resource('projects', function () {
        this.resource('listings', { path: '/:project_id/listings' }, function() {
            this.route('listing', { path: '/:listing_id' });
        });
    });         
});

然后，

项目

模板应仅为

{{outlet}

。如果您只想在导航到/projects时呈现内容，而不想在更深的导航时呈现内容，请将该内容放入

projects/index

模板（或根据命名约定调用的任何模板）中并在

ProjectsIndexRoute

和

ProjectsIndexController

上设置任何必要的路由器和控制器。现在，您的

列表

模板将只嵌套在

项目

中，这只是一个出口，您在查看列表时不会看到任何

项目/索引

内容

---

有几件事是错误的：1-正如您所说，您需要在项目模板上添加一个{{outlet}}，因为清单是项目的子项，因此它的模板需要在父模板中放置一个位置来渲染。2-将项目对象传递给listings route/controller，其中listings模板需要一个列表。3-清单模板引用的是listing.PropertyCode，而不是listing.PropertyCode。提琴：然而-我不确定所有这些都能真正回答你的问题-请修改提琴或修改问题以提供更多信息和代码。@MeoriOransky谢谢你的时间。我加了一把新的小提琴来纠正错误。它可以工作，但是清单模板在项目内部呈现，而我想完全替换项目。所以我想我应该像以前那样取消资源嵌套，只使用“路径”散列来操作url。但是，如果我这样做，列表模板将无法呈现。请看一下这把新小提琴。你能指出我做错了什么吗？谢谢你，这很有效。现在，这是在Ember中进行路由（使用索引路由）的正确方法吗？我的意思是，如果我想让一个URL看起来像是嵌套的，但希望资源使用完全不同的模板，那该怎么办？这绝对是Ember的方法。每个资源随附的索引路由（只要您提供一个函数作为最后一个参数）解决了提供内容的问题，这些内容只有在您路由到该级别时才能看到（例如，一个可能提供资源的实际索引）。如果您想嵌套资源，但在每个级别上都有不同的模板，那么可以在每个级别上使用索引路由。请注意，当您访问嵌套资源时，资源上的路由器钩子将一直触发，但唯一触发其钩子的索引路由是您访问的那个。