[英]Sending data into a nested Controller/View in EmberJS
I'm messing around with JSON structures in EmberJS starting from the top level Application level and trying to pass data to a general MenuController/MenuView child so I can reuse it. 我从顶级应用程序级别开始搞乱EmberJS中的JSON结构,并试图将数据传递给常规的MenuController / MenuView子级,以便我可以重用它。
The JSON I've come up with to play around with how data gets passed through nested ember structures is this: 我想出的JSON是如何通过嵌套的余烬结构传递数据的:
JSON JSON
{
appName: "CheesyPuffs"
menuItems: [
{name:"Gouda"}
{name:"Crackers", menuItems: [
{name: "Cheezeits"}
]
}
]
}
Handlebars 把手
<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>
JS JS
App.MenuController = Ember.ArrayController.extend({
actions: {
click: function(){
// Signal Event to App
}
}
});
App.MenuView = Ember.View.extend({
click: function(){
console.log("I clicked a menu");
}
});
All the examples I've seen concerning nested stuff involves routes with the classic _id subroute. 我所看到的有关嵌套内容的所有示例都涉及带有经典_id子路由的路由。 I'm not sure how I would go about telling the App Router that it needs to pass the menuItems data to a child controller that's embedded in the same view.
我不确定如何告诉App Router它需要将menuItems数据传递给嵌入在同一视图中的子控制器。 I have a feeling you can do this both via the template and programmically?
我觉得您既可以通过模板也可以通过编程方式执行此操作? If so, how would you do it both ways?
如果是这样,您将如何同时进行?
using the template you should use render
. 使用应该使用
render
的模板。 And that's the way you should do it, programmatically doesn't make sense. 那就是您应该这样做的方式,以编程方式没有意义。
<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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.