Javascript 将数据发送到EmberJS中的嵌套控制器/视图

我在EmberJS中摆弄JSON结构，从顶级应用程序级别开始，尝试将数据传递给通用的MenuController/MenuView子级，以便可以重用它

我提出的JSON用于研究数据如何通过嵌套的余烬结构传递，如下所示：

JSON

{
appName: "CheesyPuffs"
menuItems: [
    {name:"Gouda"}
    {name:"Crackers", menuItems: [
                              {name: "Cheezeits"}
                            ] 
    }
]

}

把手

<script type="text/x-handlebars">
<div class='app'>
  <div class='header'>
     {{#if menuItems}}
    // Embed template 'menu'
     {{/if}}
  </div>
</div>
</script>

<script type="text/x-handlebars" data-template-name="menu">
<ul>
{{#each menuItems}}
    <li>{{name}}</li>
    {{#if menuItems}}
       // Embed menu template
     {{/if}}
{{/each}}
</ul>
</script>

---

我看到的所有关于嵌套内容的示例都涉及到带有经典_id子例程的路由。我不知道如何告诉应用程序路由器它需要将menuItems数据传递给嵌入在同一视图中的子控制器。我有一种感觉，你可以通过模板和程序来实现这一点？如果是这样的话，你会怎么做呢

使用您应该使用的模板

渲染

。这是你应该做的，编程是没有意义的

<script type="text/x-handlebars">
<div class='app'>
  <div class='header'>
     {{#if menuItems}}
        {{render 'menu' menuItems}}
     {{/if}}
  </div>
</div>
</script>

<script type="text/x-handlebars" data-template-name="menu">
<ul>
{{#each menuItems}}
    <li>{{name}}</li>
    {{#if menuItems}}
        {{render 'menu' menuItems}}
     {{/if}}
{{/each}}
</ul>
</script>

{{{if menuItems}}
{{render'menu'menuItems}}
{{/if}

{{{#每个菜单项}
{{name}}
{{{if menuItems}}
{{render'menu'menuItems}}
{{/if}
{{/每个}}

<script type="text/x-handlebars">
<div class='app'>
  <div class='header'>
     {{#if menuItems}}
        {{render 'menu' menuItems}}
     {{/if}}
  </div>
</div>
</script>

<script type="text/x-handlebars" data-template-name="menu">
<ul>
{{#each menuItems}}
    <li>{{name}}</li>
    {{#if menuItems}}
        {{render 'menu' menuItems}}
     {{/if}}
{{/each}}
</ul>
</script>