EmberJS：如何在选择更改时呈现模板答案

【问题标题】：EmberJS: How to render a template on select changeEmberJS：如何在选择更改时呈现模板
【发布时间】：2013-09-06 00:24:58
【问题描述】：

我是 ember 的新手，正在尝试弄清楚如何在选择控件更改时呈现模板。

代码：

    App.LocationTypeController = Ember.ArrayController.extend({

    selectedLocationType: null,

    locationTypeChanged: function() {
        //Render template
    }.observes('selectedLocationType')
});

{{view Ember.Select 
  contentBinding="model"
  selectionBinding="selectedLocationType"
  optionValuePath="content.id"
  optionLabelPath="content.name"}}

当 locationType 更改时，控制器中会触发 locationTypeChanged 函数。但是我如何从那里将一些内容渲染到 dom 中？ (this.render()?)...

【问题讨论】：

标签： javascript jquery ember.js handlebars.js

【解决方案1】：

是的，您必须只使用this.render()，但这里的关键是其中的into 选项。

App.LocationTypeController = Ember.ArrayController.extend({

 selectedLocationType: null,

 locationTypeChanged: function() {
    var selectedLocationType = this.get('selectedLocationType');
    this.send('changeTemplate',selectedLocationType);
 }.observes('selectedLocationType')
});

让你的路线中的动作为

changeTemplate: function(selection) {
          this.render('template'+selection.id,{into:'locationType'});
 }

并在您的locationType 的模板中添加一个{{outlet}}。

{{view Ember.Select 
       contentBinding="model"
       selectionBinding="selectedLocationType"
       optionValuePath="content.id"
       optionLabelPath="content.name"}} 

{{outlet}}

样品JSBin 满足您的要求

【讨论】：

【解决方案2】：

如果你只需要显示一个框架，当存在选定的东西时，你可以使用if车把助手：

在您的模板中

...

{{#if selectedLocationType}}
  Any content here will be visible when selectedLocationType has some value
{{/if}}

...

{{view Ember.Select 
  contentBinding="model"
  selectionBinding="selectedLocationType"
  optionValuePath="content.id"
  optionLabelPath="content.name"}}

希望对你有帮助

【讨论】：