5

ビューモデルを非表示フィールドにJSON形式で保存したい。すべて正常に動作します。

しかし、私がそれを取得しようとすると、エラーが発生します:

キャッチされないエラー:バインディングを解析できません。メッセージ:ReferenceError:selectAllが定義されていません。バインディング値:チェック済み:AllCheck、クリック:selectAll

JsFiddler

viewModel

function AppViewModel() {

//Week
this.AllCheck = ko.observable(false);
this.DaysOfWeekResult = ko.observableArray();

this.selectAll = function () {
    if (this.AllCheck()) {
        viewModel.DaysOfWeekResult.removeAll();

        viewModel.DaysOfWeekResult.push("Mo");
        viewModel.DaysOfWeekResult.push("Tu");
        viewModel.DaysOfWeekResult.push("We");
        viewModel.DaysOfWeekResult.push("Th");
        viewModel.DaysOfWeekResult.push("Fr");
        viewModel.DaysOfWeekResult.push("Sa");
        viewModel.DaysOfWeekResult.push("Su");
    }

    return true;
};

    this.dayClicked = function () {
    checkDays();
    return true;
};        

}

初期化コード

var viewModel;    
$().ready(function (){
        viewModel = new AppViewModel();
var viewModelDeserialized = ko.mapping.fromJSON(serializedJsonString, viewModel);

        ko.applyBindings(viewModel);
}); 


function checkDays() {
    viewModel.AllCheck(viewModel.DaysOfWeekResult().length == 7);   
}  

シリアル化されたモデル

var serializedJsonString = '"AllCheck":false,"DaysOfWeekResult":[]}';

マークアップ

<div class="check-block">
                <input name="AllWeek" id="AllWeek" type="checkbox" value="AllWeek" data-bind="checked: AllCheck, click: selectAll" />
                <label for="AllWeek">All Week</label>
            </div>
            <div class="holder">
                <span>
                    <input name="Monday" id="Monday" type="checkbox" value="Mo" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Monday">Mo</label>
                </span><span>
                    <input name="Tuesday" id="Tuesday" type="checkbox" value="Tu" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Tuesday">Tu</label>
                </span><span>
                    <input name="Wednesday" id="Wednesday" type="checkbox" value="We" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Wednesday">We</label>
                </span>               
                <span>
                    <input name="Thursday" id="Thursday" type="checkbox" value="Th" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Thursday">Th</label>
                </span><span>
                    <input name="Friday" id="Friday" type="checkbox" value="Fr" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Friday">Fr</label>
                </span><span>
                    <input name="Saturday" id="Saturday" type="checkbox" value="Sa" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Saturday">Sa</label>
                </span><span>
                    <input name="Sunday" id="Sunday" type="checkbox" value="Su" data-day="true" data-bind="checked: DaysOfWeekResult, click: dayClicked" />
                    <label for="Sunday">Su</label>
                </span>
            </div>

</ p>

4

1 に答える 1

16

ko.mapping.fromJSON間違った引数でを呼び出しています。

あなたの場合の正しい使用法は次のとおりです。

var viewModelDeserialized = 
    ko.mapping.fromJSON(serializedJsonString, {} /* empty options */, viewModel);

デモフィドル。(バインディングエラーなし)

このメソッドの使用ko.mapping.fromJSON法は少し注意が必要です。

  • 1つの引数で呼び出すことができます。データのみを提供します。たとえばvar viewModel = ko.mapping.fromJSON(data) 、この場合は、作成されたviewModelを返します。

  • 2つの引数で呼び出すことができます:

    • 2番目の引数がkoマッピングで作成されたviewModelの場合、マッピングターゲットとして扱われますko.mapping.fromJSON(data, koMappingCreatedViewModel)
    • それ以外の場合、2番目の引数はマッピングオプションとして扱われます(これはあなたの場合に発生します)var viewModel = ko.mapping.fromJSON(data, options)
  • データ、マッピング、ターゲットを明示的に指定する3つの引数を使用して呼び出すことができます。ko.mapping.fromJSON(data, options, target)

于 2012-11-10T17:15:35.083 に答える