Ember选择设置默认值 [英] Ember Select set default value

问题描述

即使阅读了很多文档，我仍然无法完成这项简单的任务;

我的模板中有一个选择视图：

  {{查看Ember.Select id =id_diffcontentBinding =难度optionValuePath =content.idoptionLabelPath =content.title valueBinding =selectedDifficulty}} 
  

此选择正确填写此数据：
{id：1，title：easy} {id：2，title：medium} {id：3，title：hard}

我只想设置默认值到中而不是简单的，现在是默认值;控制器：

  Gmcontrolpanel。 InsertActivityController = Em.Controller.extend（{
 difficulty：function（）{
 var difficulty = []; 
 difficulty = this.get（'store'）find（' ; 
返回困难; 
} .property（），
 changeDifImg：function（）{
 jQuery（'。diff-icon'）。animate（{'opacity'：0 }，$）
 jQuery（'＃diff-img'+ jQuery（'＃id_diff'）。val（））。animate（{'opacity'：1}，300）; 
}。观察（'selectedDifficulty'），
 startValue：null 
}）; 
  

当用户更改select中的值时，ChangeDifImg属性用于更改相关的难度图标; / p>

（在模板中：

  {{＃困难困难}} 
< img class =diff-iconid =diff-img {{unbound difficulty.id}}src ={{unbounddifficulty.link}}style =opacity： 0/> 
 {{/ each}} 
  

难度并设置它们全部不可见;然后当用户在Select中选择一个值时，changeDifImg属性显示正确的图标

解决方案

最后很容易：

  {{查看Ember.Select contentBinding =controller.difficultyoptionValuePath =content.id optionLabelPath =content.titlevalueBinding =idDiff}} 
  

然后在控制器中： / p>

  App.DifficultyController = Ember.Controller.ext end（{
 idDiff：'2'
}）; 
  

使用此选项将以默认值2开头;如果要设置默认值而不是按照内容设置，则需要使用selectionBinding而不是valueBinding

Even after reading a lot of doc, I'm still not able to accomplish this simple task;

I have a select view in my template:

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

this select is filled correctly with this data: {id: 1, title: easy}{id: 2, title: medium}{id: 3, title: hard}

I just want to set the default value to "medium" instead of easy that is the default value now; how can I do this?

The Controller:

Gmcontrolpanel.InsertActivityController = Em.Controller.extend({
difficulties: function() {
    var difficulties = [];
    difficulties = this.get('store').find('difficulty');
    return difficulties;
}.property(),
changeDifImg: function() {
    jQuery('.diff-icon').animate({'opacity': 0}, 300);
    jQuery('#diff-img' + jQuery('#id_diff').val()).animate({'opacity': 1}, 300);    
}.observes('selectedDifficulty'),
startValue: null
});

The ChangeDifImg property is used to change the associated difficulty icon when user changes the value in the select;

(in the template:

{{#each difficulty in difficulties}}
        <img class="diff-icon" id="diff-img{{unbound difficulty.id}}" src="{{unbound "difficulty.link"}}" style="opacity: 0" />
        {{/each}}

this creates one immage for every difficulty and set them all invisible; then when the user selects a value in the Select, the changeDifImg property shows the correct icon

解决方案

In the end was easy:

{{view Ember.Select contentBinding="controller.difficulty" optionValuePath="content.id" optionLabelPath="content.title" valueBinding="idDiff"}}

and then in the controller:

App.DifficultyController = Ember.Controller.extend({
    idDiff: '2'
});

With this the Select will start with default value of '2'; if you want to set the default not by value but by content, you need to use selectionBinding instead of valueBinding

这篇关于Ember选择设置默认值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！