MVCからのノックアウトマッピング

Question

ko.mappingユーティリティを使用して、自分のMVCモデルをknockoutjsにバインドします。 私のMVCモデルは、この

public class Person 
    { 
    public string Name { get; set; } 
    public string Surname { get; set; } 
    public Achievement[] achievements { get; set; } 
    } 

    public class Achievement 
    { 
    public string Title { get; set; } 
    public int Score { get; set; } 
    } 


    public ActionResult Index() 
    { 
    Person person = new Person 
    { 
     Name = "Name", 
     Surname = "Surname", 

     achievements = new Achievement[] 
     { 
      new Achievement { Title="Ach 1", Score=10 }, 
      new Achievement { Title="Ach 2", Score=11 }, 
      new Achievement { Title="Ach 3", Score=12 }, 
     } 
    }; 
    return View(person); 
    } 

が、私は私のjavascriptのモデルは人の両方のいくつかの追加のプロパティを含むようにしたいと達成ので、私はノックアウトマッピング・プラグインを使用して、JavaScriptで唯一の新しいプロパティ（Person.fullNameと達成を書くオブジェクトです。メッセージ）。

@{ 
    string theData = new JavaScriptSerializer().Serialize(Model); 
} 
    <div> 
    <div><label>Name </label> <span data-bind="text:Name"></span></div> 
    <div> <label>Surname </label> <span data-bind="text:Surname"></span> </div> 
    <div> <label>Full Name </label> <span data-bind="text:fullName"></span></div> 

    <ul data-bind="foreach:achievements"> 
     <li> 
      <span data-bind="value:Title" /> 
      <span data-bind="text:Score"></span> 
      <span data-bind="text:Message"></span> 
     </li> 
    </ul> 
</div> 
<script type="text/javascript"> 
    personViewModel = function (data) { 
     var self = this; 
     ko.mapping.fromJS(data, {}, self); 
     self.fullName = ko.computed(function() { 
      return self.Name() + " " + self.Surname(); 
     }); 
    } 

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

     self.Message = ko.computed(function() { 
      return self.Title() + " " + self.Score(); 
     }); 
    } 
    ko.applyBindings(new personViewModel(@Html.Raw(theData))); 
</script> 

達成クラスが全くマッピングされていないという問題があります。 MVCコントローラからデータをロードする正しい方法は、モデルをC＃とjavascriptで2回書く必要がありません。

var custMap = {}; 

custMap['achievements'] = { 
create: function(data) { 
    var result = []; 
    for(var i = 0; i < data.length; i++){ 
    result.push(new achievement(data[i]); 
    } 
    return new ko.observableArray(result); 
} 
} 

をし、それをマップするために：

Answer 1

あなたはこのような何かを試すことができ

ko.mapping.fromJS(data, custMap, self);