在Ember.Select中选择值时更新值

Question

我的模板中有一个Ember.Select，还有一个图像：

Difficulty: {{view Ember.Select id="id_diff" contentBinding="difficulties" optionValuePath="content.id" optionLabelPath="content.title"}}
<img src="(path)" />

“选择”中充满了来自服务器的值；在控制器中：

difficulties: function() {
    return this.get('store').find('difficulty');
}.property()

而模型：

Gmcontrolpanel.Difficulty = DS.Model.extend({
    title: DS.attr('string'),
    description: DS.attr('string'),
    path: DS.attr('string')
});

这没关系，但是我希望当从Ember.Select中选择一个困难时，corrispondent属性将被插入到img标记中，任何人都知道如何获得这个结果吗？

Answer 1

为了做到这一点，我会设置几件事。

首先，使用新属性更新Ember.Select以包含针对模型的valueBinding：

{{view Ember.Select id="id_diff" contentBinding="difficulties" optionValuePath="content.id" optionLabelPath="content.title" valueBinding="selectedDificulty"}}

这将将select视图绑定到模型对象。这意味着，在控制器上，我们现在可以在该字段中包含一个带有.observes的新函数：

updateImage : function(){
    this.set('fullPath', this.get('path') + this.get('selectedDificulty'));
}.observes('selectedDificulty');

最后，将图像路径更改为新创建的路径：

<img src="(fullPath)"/>