knockout.js - knockout.js を使用して 2 次元マトリックスを作成する方法についての指示が必要です

Question

私はノックアウト.jsの初心者です。HTML構造のようなマトリックスを作成しようとしています。私はゼロから始めようとしています。ユーザーには行追加ボタンがあり、これにより行が作成されます。複数の行を追加できます。今、列を追加しようとしています。列は基本的に既存のテーブルをコピーしてコピーを作成し、次の列に表示する必要があります。

ここまでたどり着きました。jsfiddleへのリンク

読みやすいようにコードを追加する HTML CODE です。

<div class='liveExample'> 

<div data-bind='simpleGrid: gridViewModel'> </div>

<button data-bind='click: addRowItem'>
    Add Row
</button>
<button data-bind='click: addColItem'>
    Add Col
</button>      

これは、knockout.js 関数を使用した Java スクリプト コードです。

var initialData = [
    { name: "" }
];



var PagedGridModel = function(items) {
    this.items = ko.observableArray(items);


this.addRowItem = function() {
    this.items.push({ name: "New Row" });
};

this.gridViewModel = new ko.simpleGrid.viewModel({
    data: this.items,
    columns: [
        { headerText: "", rowText: "name"}
    ],
});

};
ko.applyBindings(new PagedGridModel(initialData));