我无法使用用于多选输入的 can-value 帮助器来呈现所选值。
当使用 can.Map 动态呈现选项而不是在 DOM 中提供可用选项时,特别会出现此问题。
这是一个解释这个问题的小提琴:
http://jsfiddle.net/neildcruz19/ramey3zo/6/
控制
var selectControlInst = null;
var selectControl = can.Control({
},{
init : function ( element, options) {
$( element ).html(can.view('multiSelectTemplate',this.getMap()));
},
getMap : function() {
return new can.Map({
selectedOptions : ['option1','option2'],
options : [{
display :'Option 1',
value :'option1'
},
{
display :'Option 2',
value :'option2'
},
{
display :'Option 3',
value :'option3'
},
{
display :'Option 4',
value :'option4'
},
{
display :'Option 5',
value :'option5'
}]
});
}
});
$(function(){
selectControlInst = new selectControl('.selectContainer');
});
小胡子/HTML
<script id="multiSelectTemplate" type="text/mustache">
<select class="multipleSelect" can-value="selectedOptions" multiple="multiple" size="5">
{{#options}}
<option value="{{value}}">{{display}}</option>
{{/options}}
</select>
<br/>
<br/>
<select class="multipleSelect" can-value="selectedOptions" multiple="multiple" size="5">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
<option value="option4">Option 4</option>
<option value="option5">Option 5</option>
</select>
</script>
有没有办法解决这种情况?