19

ノックアウト js を使用して、ボックスにデータを入力して管理しようとしてい<select/>ます。初期値を空にしたいです。

ただし、最初は言うまでもなく、いつでもマネージド値を強制的に null にしようとすると問題が発生します。

たとえば、次のフィドルを考えてみましょう:

HTML:

<select data-bind="options: myOptions, value: myValue"></select> aka
<span data-bind="text: myValue"></span>

<div>
    <button data-bind="click: setMyValue(null)">clear the selection</button>
    <button data-bind="click: setMyValue('one')">select "one"</button>
    <button data-bind="click: setMyValue('four')">select "four"</button>
</div>
<ul data-bind="foreach: log">
    <li>message: <span data-bind="text: message"></span></li>
</ul>

JS:

function Model() {
    var self = this;
    self.myOptions = ['one', 'two', 'three', 'four'];
    self.myValue = ko.observable();
    self.setMyValue = function (val) {
        return function(){
            this.log.push({
                message: "ok, trying to set value as " + val
            });
            self.myValue(val);
        };
    };
    self.log = ko.observableArray([]);
}
var model = new Model();
ko.applyBindings(model);

select "one"とボタンはselect "four"、 の更新を強制することによって選択を変更するように機能しますmyValue()。ただし、選択解除ボタンは機能しません。選択は によってクリアされませんmyValue(null)これが適切な方法だと思いました

私は何を間違っていますか?

4

1 に答える 1

32

optionsCaptionバインディング セットが必要です。

<select data-bind="options: myOptions, value: myValue, optionsCaption: 'select...'"></select>

更新されたフィドル

于 2013-03-18T16:08:15.763 に答える