我希望有人可以解释我在这里做错了什么。我使用带有把手模板的Ember.js,我已尝试了多种方法来获取把手#if else为我工作但它总是返回if和else的内容..这里' s我目前正在使用的代码。
App.js:
App = Ember.Application.create({
selectedView: "Home",
IsHome: function() {
this.get('selectedView') === 'Home'
}.property('selectedView')
});
index.html head包含:
<script type="text/x-handlebars" data-template-name="home-view">
Hello, This is the home view.
</script>
<script type="text/x-handlebars" data-template-name="edit-account">
Hello, This is the account edit view.
</script>
并在身体中:
<script type="text/x-handlebars">
{{#if App.IsHome}}
{{view HomeView}}
{{else}}
{{view editAccountView}}
{{/if}}
</script>
最终会在页面正文中显示两个视图。任何建议表示赞赏,
感谢 史蒂夫
答案 0 :(得分:5)
问题的根本原因是Handlebars视图助手({{view MyView}})需要一个Ember“类”的路径参数,而不是类的实例。要创建视图类,请使用extend
的{{1}}方法。 Handlebars视图助手将实例化您的视图类并将其附加到文档中。
有关Ember对象模型以及Ember Ember.View
和extend
方法之间差异的更多信息,请参阅此帖子:http://ember-object-model.notlong.com。
以下是您的示例,其中进行了一些更改以纠正我上面提到的观点。 http://jsfiddle.net/ethan_selzer/kcjzw/217/
此致
探
答案 1 :(得分:2)
这是因为您要使用homeView
手动附加两个视图(editAccountView
和appendTo
)。
另外,避免在App create()
函数中定义视图。因此,创建您的应用程序:
App = Ember.Application.create({
ready: function() {
App.MainView.create().append();
}
});
其中App.MainView
是您定义的顶级视图:
App.MainView = Ember.View.extend({
templateName: 'main-view',
selectedView: "Home",
isHome: function() {
this.get('selectedView') === 'Home'
},
homeView: Ember.View.extend({
templateName: 'home-view'
}),
editAccountView: Ember.View.extend({
templateName: 'edit-account'
})
});
使用把手模板:
<script type="text/x-handlebars" data-template-name="main-view">
{{#if view.isHome}}
{{view view.homeView}}
{{else}}
{{view view.editAccountView}}
{{/if}}
</script>