null から実際に設定されたオブジェクトに切り替わるネストされたプロパティを持つ複雑なオブジェクトがあります。ko.mapping.fromJSON を使用して、最初からすべてをうまくマッピングできます。しかし、イベントによって後続のマッピングが発生し、プロパティが null になり、他のプロパティが値を取得すると、マッピングが狂ってしまいます。
「アップデート!」ボタンをクリックすると、アラート('1')が発生し、「Test2」が表示されます。ただし、「更新!」をクリックしてください。再び alert('2') が発生しますが、テキストは変更されません。何か案は?
html:
<p> <span>Name:</span>
<span data-bind="text: IntroData ? IntroData.Name : TempData.Name"></span>
<button id="update" data-bind="click: Update">Update!</button>
</p>
JavaScript:
var ViewModel = function (data) {
var me = this;
ko.mapping.fromJS(data, {}, me);
me.Update = function () {
if (me.Index() == '0' || me.Index() == '2') {
alert('1');
ko.mapping.fromJS(stuff2, {}, me);
} else {
alert('2');
ko.mapping.fromJS(stuff3, {}, me);
}
};
return me;
};
var stuff = {
Index: '0',
IntroData: {
Name: 'Test'
},
TempData: null
};
var stuff2 = {
Index: '1',
IntroData: {
Name: 'Test2'
},
TempData: {
Name: 'Temp2'
}
};
var stuff3 = {
Index: '2',
IntroData: null,
TempData: {
Name: 'Temp3'
}
};
window.viewModel = ko.mapping.fromJS(new ViewModel(stuff));
ko.applyBindings(window.viewModel);