9

ASP.NetMVCアプリケーションに取り組んでいます。私のアクションは、オブジェクトの配列であるモデル（Name、ID、IsViewableなどのプロパティを持つクラス）を含むビューを返すことです。

var model = @Model.ToJson(); // done via extension call

この配列を観察したいので、配列が変更されるたびに、テンプレートにバインドされているテーブルを更新できます。

var viewModel = {
    accounts = ko.observableArray(model)
}

これは、配列に要素を追加したり、配列から要素を削除したりする場合に問題なく機能します。ただし、アカウントの1つ（名前またはID）のプロパティが変更されたときにテンプレートを更新する必要もあります。

KnockoutJSのWebサイトには、次のように書かれています。もちろん、必要に応じてこれらのプロパティを監視可能にすることもできますが、それは独立した選択です。これは私がどうしたらいいかわからないことです。

私は無駄にこのようなことを試みました：

var viewModel = {
    accounts = ko.oservableArray([])
}

for(var i = 0; i < model.length; i++) {
    ko.observableArray(model[i]);
    viewModel.accounts.push(model[i]);
}

必要に応じて、テンプレートとテーブルを投稿できます。

4

3 に答える 3

4

私はこれを機能させることになったので、同じ問題を抱えている可能性のある人と共有したいと思いました。

配列項目をJavaScriptクラスでラップする必要があります。次に、コンストラクターで、各プロパティをobserableに設定します。

var model = @Model.ToJson();

var viewModel = {
    accounts = ko.observableArray(ko.utils.arrayMap(model, function(account) {
        return new AccountWrapper(account);
    }))
};

function AccountWrapper(account) {
    this.Property1 = ko.observable(account.Propery1);
    this.Property2 = ko.observable(account.Propery2);
    this.Property3 = ko.observable(account.Propery3);
}

ko.applyBindings(viewModel);

また、アイテムの1つを直接変更して変更を確認する場合は、次のようにすることができます。

viewModel.accounts()[3].Name('My Name Changed');

また、アイテムが追加または削除されたときに通知を受け取ることができます。

viewModel.accounts.remove(viewModel.accounts()[4]);
于 2011-01-21T20:21:20.083 に答える
4

knockout.mappingプラグインを調べる必要があります。私はそれがあなたがしようとしているすべてを行うと思います。

于 2011-01-28T15:58:41.190 に答える
0

マッピングプラグインを必要とせずに機能する別のアプローチは次のとおりです。

var model = @Model.ToJson();

var viewModel = {
    accounts: ko.observableArray([]),

    fromJS: function(js) {
        for (var i = 0; i < js.length; i++) {
            this.accounts.push({ 
                Property1: ko.observable(js[i].Property1),
                Property2: ko.observable(js[i].Property2),
                Property3: ko.observable(js[i].Property3)
            });
        }
    }
};

viewModel.fromJS(model);
ko.applyBindings(viewModel);
于 2011-02-26T04:01:06.897 に答える