サーバー側のasp.netアプリケーションから受け取ったjsonオブジェクトをマップするために、knockout.jsのマッピング関数を使用しています。Chrome のデバッガーを使用すると、json オブジェクトが正常に受信されていることがわかりますが、ko.mapping.fromJS を使用して監視可能なオブジェクトを作成すると、すべての内部の監視可能な配列が長さ 0 として表示されます。QCTest 内には複数の配列があります。
var testDefJSON = getTestDefJSON();
var ViewModel = function () {
var self = this;
self.QCtest = ko.mapping.fromJS(testDefJSON);
self.hasBuiltNewGroup = ko.observable(false);
self.selectedOp = ko.observable();
self.selectedUom = ko.observable();
self.addTestGroup = function () {
show_modal("createGroupModal");
};
self.saveTest = function () {
var jsData = ko.toJS(ViewModel);
var json = JSON.stringify(jsData);
$.ajax({
type: 'POST',
url: '/Test/SaveTest',
async: false,
data: json,
contentType: "application/json",
success: function (result) { alert(result) },
error: function () { alert("failed to post test data"); }
});
};
self.delItems = function () {
alert(self.QCtest.QCTestGroups.length);
};
self.closeItemModal = function () {
ViewModel.hasBuiltNewGroup(false);
close_modal();
};
self.createNewGroup = function () {
ViewModel.hasBuiltNewGroup(true);
};
self.addNewTestItem = function () {
alert("Adding new test item button works");
};
};
var viewModel = new ViewModel();
ko.applyBindings(viewModel);
内部配列に対して foreach/template を使用すると、すべての UI 要素が正常に表示されます。しかし、delItems ボタンをクリックするとアラートがポップアップし、内部配列 QCTestItems の長さが少なくとも 1 である必要があるのに 0 であることが示されます (ただし、配列内のテスト項目の数に関係なく)。
delItems ボタンを押したときにチェックされているアイテムを削除できるようにする必要があります。これを行うには、その配列内の要素にアクセスする必要があり、長さが0になるため、それを行うことが難しくなっています。
どんな助けでも大歓迎です
編集:
self.delItems = function () {
alert(self.QCtest.QCTestGroups.length);
};
に変更self.delItems = function () {
alert(self.QCtest.QCTestGroups().length);
};
そして今、それは動作します