Ember.js车把如果,否则声明

Ember.js handlebars if, else statement

本文关键字:声明 如果 js Ember      更新时间:2023-09-26

我希望有人能解释我在这里做错了什么。我正在使用 Ember.js 带有车把模板,我已经尝试了许多方法来让车把 #if 其他东西对我有用,但它总是返回 if 和 else 的内容。这是我当前使用的代码。

应用.js:

App = Ember.Application.create({
  selectedView: "Home",
  IsHome: function() {
    this.get('selectedView') === 'Home'
}.property('selectedView')
});

索引.html头包含:

<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>

这最终会在页面正文中显示两个视图。任何建议不胜感激,

谢谢史蒂夫

问题的根本原因是车把视图助手 ( {{view MyView}} ) 需要 Ember "类"的路径参数,而不是类的实例。若要创建视图类,请使用 Ember.Viewextend 方法。Handlebars 视图帮助程序将实例化您的视图类并将其追加到文档中。

有关 Ember 对象模型以及 Ember 的extendcreate方法之间的差异的更多信息,请参阅这篇文章: http://ember-object-model.notlong.com。

这是您的示例,其中包含一些更改以更正我上面提出的观点。 http://jsfiddle.net/ethan_selzer/kcjzw/217/

问候

伊森

那是因为您正在使用appendTo手动附加两个视图(homeVieweditAccountView)。

此外,请避免在应用程序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>