1

サーバー側のオブジェクトを JSON にマッピングするために、ノックアウト マッピングを使用しています。多数のコレクションを含むオブジェクトがあるため、JavaScript で各ピースを手動で再作成してマップする必要はありません。だから、私はこれを行うためにノックアウトマッピングを使用しています。

私は問題を抱えていたので、簡単な例で試してみることにしました。ASP.NET MVC アプリケーションの場合は次のとおりです。

C# モデル:

    public class Vaccinations
{
    public string Vaccination { get; set; }
    public System.DateTime VaccinationDate { get; set; }
}

public class Dog
{
    public string Name { get; set; }
    public int Age { get; set; }

    public Dog()
    {
        this.Vaccinations = new System.Collections.Generic.List<Vaccinations>();
    }

    public System.Collections.Generic.List<Vacinations> Vacinations { get; set; }
}

ご覧のとおり、各犬には、接種しているワクチンと接種していないワクチンのリストがあります。

私のコントローラーでは、事前設定された Dog オブジェクトを作成して返します。

        public ActionResult Load()
    {
        Dog rambo = new Dog
        {
            Name = "Rambo",
            Age = 5
        };

        rambo.Vacinations = new System.Collections.Generic.List<Vacinations> {
            new Vacinations { Vacination = "Rabies", VacinationDate = DateTime.Now.AddYears(-1) },
            new Vacinations { Vacination = "Mumps", VacinationDate = DateTime.Now.AddYears(-2) }
        };

        return Json(rambo, JsonRequestBehavior.AllowGet);
    }

私の見解 (Index.cshtml) では、犬とその予防接種のリストを表示するように設定しています。ユーザーが Add Vaccination ボタンをクリックして新しい行をコレクションに追加し、データを入力できるようにしたいと考えています。

ここでも、knockout.mapping を使用してマッピングを行っています。JavaScriptセクションでは、これは私が持っているものです:

    var ViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, {}, self);

    self.isValid = ko.computed(function () {
        return self.Name().length > 3;
    });

    // Operations
    self.save = function () {
        $.ajax({
            url: "Dog/Save",
            type: "post",
            contentType: "application/json",
            data: ko.mapping.toJSON(self),
            success: function (response) {
                alert(response.Status);
            }
        });
    };

    self.addVaccination = function () {
        self.Vaccinations.push(new self.Vaccination());  // <--- This doesn't work and I know why, so how do I do this?
    }
};

$(function () {
    $.getJSON("Dog/Load", null, function (data) {
        ko.applyBindings(new ViewModel(data));
    });
});

私の質問は、ViewModel オブジェクトに追加した「addVaccination」関数に関するものです。Javascriptで「コーディング」することなく、新しい「ワクチン接種」オブジェクトを指定するにはどうすればよいですか? それが私がノックアウト マッピングを使用した理由であり、その必要はありません。しかし、それ以外の方法は見当たりません。

新しいオブジェクトを作成できるように、Vaccinations オブザーバブル配列からベース Vaccination オブジェクトにアクセスする方法はありますか?

最後の質問は、これをコントローラーに戻す方法です。これが機能するかどうかはわかりません。

4

1 に答える 1

0

直接できません。しかし、できることは、サーバー側で Vaccination インスタンスを定義し、それをデフォルト インスタンスとして返すことです。

したがって、古いデータとデフォルトのインスタンスを返す必要があります。

public ActionResult Load()
{
    ...
    var data = new {
         defaultVacination = new Vacination(),
         rambo =  rambo,
    };
    return Json(data , JsonRequestBehavior.AllowGet);
}

クライアント側では、同じデータとデフォルトのインスタンスを受け取ります。

var ViewModel = function (data) {
    var self = this;    
    ko.mapping.fromJS(data.rambo, {}, self);
    var defaultInstance =  data.defaultVacination;        
    ...      
     self.addVaccination = function () {
        // clone the default instance.
        self.Vaccinations.push(ko.utils.extend({}, defaultInstance));  

}

お役に立てば幸いです。

于 2013-08-09T16:00:47.757 に答える