1

我无法使用用于多选输入的 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>

有没有办法解决这种情况?

4

0 回答 0