1

foreachループでラジオボタンを生成しています。チェックされたプロパティを親の基本的なオブザーバブルにバインドしようとしています。残念ながら、ラジオボタンをクリックすると、クリックハンドラーで親のプロパティが更新されないようです。

以前のいくつかの作業に基づくと、クリックハンドラーは、ビューモデルの更新された値を取得するための許容可能な場所である必要があるようです。最も不思議なことに、ラジオボタンを数回クリックすると、正しい値が出始めたようです。

フルフィドル

コード：

function Question() {
    this.name = "My Question";

    this.answers = ko.observableArray([
        new Answer(1, "Answer 1", false),
        new Answer(2, "Answer 2", true),
        new Answer(3, "Answer 3", false)]);

    this.correctAnswer = ko.observable(2);
}

function Answer(id, name, isRight) {
    this.id = ko.observable(id);
    this.name = ko.observable(name);
    this.isRight = ko.observable(isRight);
}

ko.applyBindings(new Question());

$(document).on("click", "input[type='radio']", function () {
     var answer = ko.dataFor(this);
     var question = ko.contextFor(this).$parent;

     var answerId = answer.id();
     var correctAnswer = question.correctAnswer();

     alert(answerId + " should equal " + correctAnswer + 
           (answerId === correctAnswer ? " SWEET" : " DAMNIT"));
});
​

HTML

<div data-bind="text:name"></div>
<div data-bind="foreach:answers">
    <label>
        <span data-bind="text: name"></span>
        <input type="radio" name="X" data-bind="value: id, checked:$parent.correctAnswer" />
    </label>
    <br />
</div>​
4

2 に答える 2

0

変化する

answerId === correctAnswer

に

answerId == correctAnswer

毎回正しく動作するようにします。

お役に立てれば！

于 2012-05-21T18:59:00.290 に答える
0

チェックされた値を $parent.correctAnswer にバインドすると、双方向のバインドになります。つまり、正しい答えを更新して、クリックしたものになります。

次のようなものに置き換えることをお勧めします。

checked:$parent.isCorrectAnswer()

これは ko.computed であり、常に正しい答えを返しますが、選択した値が変更されたときに警告することもできます

this.isCorrectAnswer= ko.computed(function () {        
    alert('your message');
    return 2;//return correct answer
});

コードはテストされておらず、使用できるように提供されています :)

于 2012-04-24T09:26:54.963 に答える