0

ここに私のビューモデルがあります:

ビューモデル

var sitesTableModel = [
{
   nameCol: "nameCol-1",
   pagesCol: "pagesCol-1",
},
{
    nameCol: "nameCol-2",
    pagesCol: "pagesCol-2",
}];

var pagesTableModel = [
{
   lastCol: "lastCol-1",
   editedCol: "editedCol-1",
},
{
    lastCol: "lastCol-2",
    editedCol: "editedCol-2",
}];


var viewModel = {
    sitesTable: ko.observableArray(sitesTableModel),
    pagesTable: ko.observableArray(pagesTableModel),
};

次に、この方法で Web サービスを呼び出します。

AJAX 呼び出し

ajaxService = (function () {
    var ajaxGetJson = function (method, request, callback, service) {
        $.ajax({
            url: "http://localhost:2880/Whatever.svc/Method",
            type: "GET",
            data: request,
            dataType: "json",
            contentType: "application/json; charset=utf-8",
            success: function (result, statusMsg, status)
            {
                callback(result, statusMsg, status, request);
            },
            error: ServiceFailed 
        }).always(function () {
            ko.applyBindings(viewModel); 
            });
    }
    return {
        ajaxGetJson: ajaxGetJson,
    };
})();

この方法で結果をマッピングします。

マッピング

function ModelTableSitesMapper(result, statusMsg, status, request) {

    var itemRow = [];

    //sitesTableModel
    result.forEach(function (entry) {
        itemRow.push({
            nameCol: entry.Title,
            pagesCol: entry.Pages,
        })
    });

    viewModel.sitesTable = ko.observableArray(itemRow);

};

他の配列についても同じです。

ここに私のデータバインディングがあります：

データバインディング

    <table id="tableDocs">  
        <tbody data-bind="foreach: documentsTable" >
        <tr>
            <td data-bind="text: nameCol">Simon Werner Hansen</td>
            <td data-bind="text: pagesCol">swh002</td>
        </tr>
        </tbody>
    </table>

結果を取得すると、すべてがテーブルで2回表示されます。モデルを確認したところ、observableArray に double データはありません。オブジェクトをobservableArrayとして2回宣言していることは知っていますが、それが問題になる可能性がありますが、これ以外に配列を更新する方法が見つかりません。

viewModel.sitesTable = ko.observableArray(itemRow);

本来あるべきようにこれを行うと、うまくいきません：

viewModel.sitesTable(itemRow);

多分誰かがこれの理由を理解できるでしょうか？

4

2 に答える 2

1

問題が見つかりました。

ajax 呼び出しの.always関数にバインディング ko.applyBinding を適用していましたが、2 つの異なる理由でサービスを 2 回呼び出していたため、バインディングがTWICE適用されました。それがデータの重複を引き起こしました。

モデルを作成した直後にバインディングを関数の外に移動しました。

于 2013-06-10T07:49:42.623 に答える
0

試してみるとどうなりますか：

var viewModel = {
    sitesTable: ko.observableArray([]),
    pagesTable: ko.observableArray([]),
};

配列に事前に入力していた変数が何であるかについては言及されていません。

次に、各アイテムをオブザーバブルに直接追加します。

function ModelTableSitesMapper(result, statusMsg, status, request) {
    //sitesTableModel
    result.forEach(function (entry) {
        viewModel.sitesTable.push({
            nameCol: entry.Title,
            pagesCol: entry.Pages,
        })
    });
};
于 2013-06-07T14:49:55.163 に答える