1

はい/いいえのドロップダウンを含むフォームがあります。「はい」を選択した場合、テンプレートを使用して、html の新しい兄弟コンテナーを n 個生成します。「はい」を選択しない場合は、空のフォームでhtmlを乱雑にしたくありません。

私はこれを行う方法を疑問に思っています。

おそらく、包含プロパティを observableArray() として作成できます。次に、何? 選択ボックスの値をチェックし、「はい」の場合はコンテンツの配列と $.each() observableArray.push() を取得する関数を実行する選択ボックスのカスタム バインディング?

これを行うための非カスタムバインディングの方法はありますか?

ありがとう。

4

1 に答える 1

0

確かに、ノックアウト オブザーバブルに関数を手動でサブスクライブすることで、これを行うことができます。ビュー モデルは次のようになります。

var myModel = function(){
    var self = this;
    self.buildItems = ko.observable(false);//for the yes/no
    self.items = ko.observableArray();

    //ask knockout to run this function when the buildItems observable value changes
    self.subscription = this.buildItems.subscribe(function(newValue){
        if(newValue == 'true'){
            //modify the items observableArray so that the UI is updated
            var newItems = [{name:'item1'},{name:'item2'}];
            self.items(newItems);
        }
    });
};

var model = new myModel();

テンプレートは次のようになります。

<div id="bindContainer">
    <select data-bind="value: buildItems">
        <option value="false">No</option>
        <option value="true">Yes</option>
    </select>
    <ul data-bind="foreach: items">
        <li data-bind="text: name"></li>
    </ul>
</div>

このアプローチのフィドルは次のとおりです。http://jsfiddle.net/vmebt/

于 2013-05-25T15:40:29.980 に答える