我正在尝试Team
在{{outlet}}
. 此Team
视图由一个简单Person
视图(团队领导)和一组Person
视图(团队成员)组成。connectOutlet()
通过调用ApplicationController来设置插座。
尽管Person
子视图按预期呈现在标记中,name
但缺少所有值。看来我的绑定和/或控制器设置不正确。我错过了什么?
代码和演示:http: //jsfiddle.net/aek38/fkKFJ/
相关的车把模板有:
<script type="text/x-handlebars" data-template-name="app">
<div class="container">
{{outlet}}
</div>
</script>
<script type="text/x-handlebars" data-template-name="person">
<em>Person name is:</em> {{name}}
</script>
<script type="text/x-handlebars" data-template-name="team">
<h3>Team Leader</h3>
<em>Leader name should be:</em>{{leader.name}}
{{view App.PersonView contentBinding="leader"}}
<h3>Team Members</h3>
{{#collection contentBinding="members"}}
{{view App.PersonView contentBinding="content"}}
{{/collection}}
</script>
代码片段:
App = Ember.Application.create({
ready: function() {
this.initialize();
},
ApplicationController: Ember.Controller.extend(),
ApplicationView: Ember.View.extend({
templateName: "app"
}),
Person: Ember.Object.extend({
name: "Jane Doe"
}),
PersonController: Ember.ObjectController.extend(),
PersonView: Ember.View.extend({
templateName: "person"
}),
Team: Ember.Object.extend({
members: [],
leader: null
}),
TeamController: Ember.ObjectController.extend(),
TeamView: Ember.View.extend({
templateName: "team"
}),
// ...