EmberJS: как визуализировать шаблон при выборе изменения


Я новичок в ember и пытаюсь понять, как визуализировать шаблон при изменении элемента управления select.

Код:

    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. Но как я могу передать некоторое содержание в дом оттуда? (этот.render()?)...

2 6

2 ответа:

Да, вы должны использовать только 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'});
 }

И иметь {{outlet}} в вашем шаблоне locationType.

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

{{outlet}}

Образец JSBin для вашего требования

Если вам нужно показать только фрагмент, когда существует что-то выбранное, вы можете использовать помощник if handlebars:

В вашем шаблоне

...

{{#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"}}

Надеюсь, это поможет