ember.js：嵌套资源出口的条件定位

从开始，我想在每个循环的“posts”中包含“post”的出口，从而产生某种类似手风琴的行为

e、 例如，路由器如下所示：

App.Router.map(function() {
  this.resource('posts', function() {
    this.resource('post', { path: ':post_id' });
  });
});

<script type="text/x-handlebars id="components/post-card">
    {{#link-to 'post' post tagName="h2"}}{{post.title}}{{/link-to}}
    <p>{{post.snippet}}</p>
</script>

<script type="text/x-handlebars" id="posts">
  <ul>
  {{#each}} -> if you're iterating through the model, no need to specify
    <li>
    <h3 {{action makeActive}}>{{title}}</h3>
    {{#if active}}
        {{post-card post=this}}
    {{/if}}
    </li>
  {{/each}}
  </ul>
</script>

模板（清除html标记以确保可读性）应执行以下操作：

<script type="text/x-handlebars" id="posts">
  {{#each model}}
    {{#link-to 'post' this}}{{title}}{{/link-to}}
    {{#if :post_id given and corresponding with this post}}   <-- that's pseudo code ;-)
      {{outlet}}
    {{/if}}
  {{/each}}
</script>

在url“/posts/1”上：

post 1 title
complete post 1
post 2 title
post 3 title

在url“/posts/2”上：

post 1 title
post 2 title
complete post 2
post 3 title

---

基本上，您希望能够将

posts

路线上的所有帖子显示为手风琴？这是错误的，因为每个模板只能有一个

{{outlet}}

。您要做的是构建一个，看起来像这样：

App.Router.map(function() {
  this.resource('posts', function() {
    this.resource('post', { path: ':post_id' });
  });
});

<script type="text/x-handlebars id="components/post-card">
    {{#link-to 'post' post tagName="h2"}}{{post.title}}{{/link-to}}
    <p>{{post.snippet}}</p>
</script>

<script type="text/x-handlebars" id="posts">
  <ul>
  {{#each}} -> if you're iterating through the model, no need to specify
    <li>
    <h3 {{action makeActive}}>{{title}}</h3>
    {{#if active}}
        {{post-card post=this}}
    {{/if}}
    </li>
  {{/each}}
  </ul>
</script>

---

您将在模型中添加

active

作为属性，而

makeActive

将是控制器中的一个操作，该操作将使给定模型的

active

为true，而使其他属性为false。这将模拟一个手风琴，尽管您的路线不会更新。

否，我不想显示所有的帖子，如果在路线“post”内，则只显示由“post/：post_id”选择的帖子。更新问题以澄清。我不确定是否/如何可以有条件出口。对于组件，您可以完成几乎相同的任务，除了路由不会更新，但它仍然具有手风琴功能。对于Ember 2.0，简单地说，每个组件都在更改。。你可能已经解决了这个问题，但我最近发现了一个非常好的解决方案，可以帮助你解决问题。